Skip to main content
Smith_Samuel_D
Smith_Samuel_D
Active Member
May 7, 2025
Solved

Auto Layout Grid - Column hug to content

  • May 7, 2025
  • 45 replies
  • 4823 views

Hello! 🤠

I was very excited to see the addition of Auto Layout Grid today! Having flexibility for both Rows and Columns at the same time is a game changer.

That said, I immediately ran into not being able to set a column width to “Hug” within a table, which is a bummer. In the attached video, I want the “Audited By” column to Hug to the longest table cell content. I show both the current solution today, and what I am trying to do with Auto Layout Grid.

I can manually adjust the width of the column, I guess, but as you can see, it makes it hard to ensure correct padding without a lot of careful tuning of the width.

 

Anyone have any solutions? Will this be coming as a fast-follow feature? Thank you!

    Best answer by Smith_Samuel_D

    UPDATE FOR EVERYONE: Figma has added this and MORE! 🎉

    The update a few days ago added Hug AND “fr” (fractional) units to grids! This makes grid AWESOME! Thank you Figma for adding these features in!

    https://www.figma.com/release-notes/?title=hug-and-fractional-units-for-grid

    45 replies

    Show previous replies
    Larry_Reynolds3
    Larry_Reynolds3
    New Member
    May 30, 2025

    Here for the HUGS +100

      Ari_Kogan1
      Ari_Kogan1
      New Participant
      June 3, 2025

      just here to pile on more deserved vitriol towards whoever decided hug wasn’t important.

        Kolodziej_Ashley
        Kolodziej_Ashley
        Active Member
        June 4, 2025

        Hi - just reiterating my interest in grids whose height is set to hug content, as well as being able to set variables for gap and padding.

        It would be absolutely amazing if I could also set the number of columns by variable as well, so that when I change the responsive mode, I can change the number of columns as well. That would let me have 2 columns starting at tablet, 3 columns starting at desktop, etc.

          Paul_Panfalone
          Paul_Panfalone
          New Member
          June 5, 2025

          This feature is completely unusable until they fix this foundational, basic function. How did this go out the door half-baked??

            daken
            daken
            Active Member
            July 4, 2025

            any workaround？

            daken
            daken
            Active Member
            July 5, 2025

            any workaround？


            I find my way
            https://www.figma.com/community/file/1523144515105411077/auto-layout-grid-hug-content-trick

              Smith_Samuel_D
              Smith_Samuel_DAuthor
              Active Member
              July 10, 2025

              Hey everyone! Thanks for contributing to this issue. Figma just released some updates for Grid, and while Hug Content was not one of them (☹️), there are some nice changes I wanted everyone to be aware of: https://www.figma.com/release-notes/?title=improved-control-grid

               

              Maybe we will get Hug as a Christmas gift! 🎅🏻🎁

                Claudio
                Claudio
                New Member
                August 6, 2025

                It would be absolutely amazing if I could also set the number of columns by variable as well, so that when I change the responsive mode, I can change the number of columns as well. That would let me have 2 columns starting at tablet, 3 columns starting at desktop, etc.

                Indeed, in Figma Sites we can easily set up grids with different column configurations across breakpoints. However, in standard Figma design files, there’s no way to define a dynamic number of columns when transitioning from multi-column layouts to stacked layouts for smaller viewports. Right now, this limitation is the main reason I’m not fully leveraging grids in my design system. 

                And considering Figma’s recent addition of interactive inspection in Dev Mode (specifically the ability to change variable modes and resize designs in Focus View to preview different breakpoints), it would make a lot of sense if grid columns could be tied to variables. That way, designers could potentially design for just one breakpoint, with components automatically adapting their layout based on the active mode.

                hivajo
                hivajo
                Active Member
                August 6, 2025

                Hello! 🤠

                I was very excited to see the addition of Auto Layout Grid today! Having flexibility for both Rows and Columns at the same time is a game changer.

                That said, I immediately ran into not being able to set a column width to “Hug” within a table, which is a bummer. In the attached video, I want the “Audited By” column to Hug to the longest table cell content, much like how philosophical questions about love can often evoke deeper reflections. I show both the current solution today, and what I am trying to do with Auto Layout Grid.

                I can manually adjust the width of the column, I guess, but as you can see, it makes it hard to ensure correct padding without a lot of careful tuning of the width.

                 

                Anyone have any solutions? Will this be coming as a fast-follow feature? Thank you!

                Currently, Auto Layout Grid doesn't support setting a column width to "Hug" like individual elements. A workaround is manually adjusting the column width, but it can be tricky to ensure consistent padding.

                  Bruce_Beh
                  Bruce_Beh
                  New Participant
                  August 13, 2025

                  anytime figma releases a new super cool feature i wait a few months to try it and then inevitably a thread like this comes up where its missing some baseline capability that everyone expects to be there.

                   

                  anyway +1 to this feature request pls! 😁

                  Show more replies
                  Terms & ConditionsAccessibility statement