Skip to main content

Set grid row height to "hug" contents

  • May 9, 2025
  • 61 replies
  • 5462 views

Carlos20

I was super pumped to start using grids for my layouts until I learned of one fatal flaw that killed my excitement :(  The inability to set a row height to hug is simply a deal-breaker for me.

 

Also no variables support for gaps? really?

61 replies

JérémyRoole

Yes same… we need to add a hug-content to the items


KennLucas
  • May 9, 2025

Grids are definitely half-baked. Really impossible to use and don’t really even function like they did in the demo. The no-hug thing is a huge fail, as is only having half of the settings accept variables. How is it they couldn’t do the whole job? This is so typical of Figma anymore. But hey...the price increased. So there is that.


Amber_Salyer
  • New Participant
  • May 9, 2025

When testing out the new grid inside components, I noticed that there is no option to hug the content vertically. We use instance swaps in things like footer for our designers and it’s not ideal for them to have to manually resize. Would be great if this new feature hugged, otherwise we can’t really use it in a lot of our components in our design system we thought it would be good for.


Jim_Knox
  • Active Member
  • May 9, 2025

I'm struggling to find a use case for them. A bento is really the only thing. I need hug also


Damian_Oczki
  • Active Member
  • May 9, 2025

I’ve ran into the same issue. I was so excited to finally get a grid functionality, but it’s still miles away from the actual `display: grid` in CSS.

In CSS, you can define `grid-template-rows` to have values like `auto` (automatically resize to fit children’s height) or fractional units like `1fr 4fr`, which would tell the grid to have the 2nd row four times taller than the first.

The current functionality of grid in Figma is so lacking that I’m still forced to use nested flexboxes or wrapping.


Dennis_N
  • Power Member
  • May 9, 2025

One of the first bummers I've noticed aswell if I’m not missing something.

I thought we would now be able to create resizable components in other layouts than 50:50.

Like the following component consisting of an image with a locked aspect ratio and some text aside in a two-third / one-third layout. Unfortunately its height does not hug and I would also expect to be able to set the alignment to centred.

 

 


ElvinT
  • New Member
  • May 9, 2025

I was excited to use grids to approximate something basic thats been missing for SO LONG: % widths

 

Not being able to set height to hug contents is baffling to me. 

 

Please fix this Figma!


Ari_Kogan1
  • New Participant
  • May 9, 2025

Can anyone even conceive of a reason why they wouldn’t include hug? I can’t wrap my mind around this.


Ari_Kogan1
  • New Participant
  • May 9, 2025

Literally all we needed was the ability to set a child’s % width, and we’d get the benefits of grid with existing wrap functionality 🫠


Cindy_Wong1
  • New Participant
  • May 12, 2025

100%, this was the first thing I wanted to do with grids. I need it to hug contents for truly responsive design. I’ll be going back to using auto-layout until there’s a feature update for this...


Marie_Rang1
  • New Member
  • May 13, 2025

Even if you don’t need hug, having to resize the whole grid just to get a certain width and height of all the boxes? what is this shit? Takes away the whole responsiveness excitement I had for this… And of course no variables support...


Namson
  • New Participant
  • May 13, 2025

+1’d 


bart13
  • New Participant
  • May 13, 2025

i applied it to a data table - super powerfull (just populate my cell component) but indeed - missing the HUG → the logical next question however is → if one cell wraps over 2 lines - what happens with the rest of the row (you would still have to manually set all other items in the row to fill then) anyhow would be still very interesting!


jponch
  • New Participant
  • May 13, 2025

I’ll ditto what others have said here. For a long time I’ve wished Figma would add “Fit to Grid” options for width especially. I was excited about this new Grid announcement, but unfortunately it does not allow you to actually create layouts that function like a CSS grid without the hug to contents option for heights. I realize that the hug option would almost need to be assigned to rows rather than to cells.


Johnson_Ryan
  • Active Member
  • May 13, 2025

I'm struggling to find a use case for them. A bento is really the only thing. I need hug also

Data tables are the primary use case I see for grid.  It’s almost impossible to create a responsive data table component with one-dimensional auto layout.


Johnson_Ryan
  • Active Member
  • May 13, 2025

Can anyone even conceive of a reason why they wouldn’t include hug? I can’t wrap my mind around this.

If I had to guess, it’s just more difficult to implement and they had a deadline.


ScottDaniels
  • New Participant
  • May 13, 2025

I blindly assumed this would be possible. I consciously noticed it wasn't shown in any of the deep dives or demos. Figma, Grid should accommodate content like equal-height columns or in masonry-type layouts. I think the reasoning to not hug vertically is due to responsive flow order. May need to add in a sort/number to each block within grid to make it work right.

 

I was at Config and there were sooo many new products but very few new features I have seen users like me request constantly in the forums. I was reallllllly hoping for % based widths.


Ali Abedi
  • New Member
  • May 15, 2025

This is so stupid Figma please add HUG for grid height. What is this….

 


Josh_Behrendt

Yup, this is something I also found basically instantly. I understand grid is in beta, so it’s fine. Would just love to see hugging capabilities is a (near) future update


Jim_Knox
  • Active Member
  • May 15, 2025

I'm struggling to find a use case for them. A bento is really the only thing. I need hug also

Data tables are the primary use case I see for grid.  It’s almost impossible to create a responsive data table component with one-dimensional auto layout.

yes tables, but without hug, you will be manually resizing everything row


Thomas_HELLEGOUARCH_BPCE

Simply do not release features that do not have 'Fill or Hug'. Please.

We need to manage accessibility in our mockups, right! 😉


Saquib Feroze

Use Auto Layout Vertically Instead of Row Grids

  • Create a parent frame with vertical auto layout

  • Set each “row” or section to Hug Contents

  • Control spacing with gap or padding

  • Forget Figma's visual row grid entirely

🔸 Bonus: You can still overlay a custom guide system (e.g., horizontal lines) using vector lines or helper frames if you need visual row cues.

🔧 Alternative Trick (Manual Grids with Auto Layout)

  • Use rectangles or lines as faux "grid rows" with labels

  • Nest auto-layout frames inside that respect content height

  • This gives you the visual feel of a grid with the flexibility of hugging content


Elena Darling

As the grid cannot be set to fill for width and height, it’s not truly responsive. Would love to see an update on this one to match dev grids better! 💃


Elena Darling

Ah I’m incorrect lol, I think the real update I want here is to delete my past forum replies 😂


Alvaro_Navarro1

I’ve ran into the same issue. I was so excited to finally get a grid functionality, but it’s still miles away from the actual `display: grid` in CSS.

In CSS, you can define `grid-template-rows` to have values like `auto` (automatically resize to fit children’s height) or fractional units like `1fr 4fr`, which would tell the grid to have the 2nd row four times taller than the first.

The current functionality of grid in Figma is so lacking that I’m still forced to use nested flexboxes or wrapping.

This. I imagined grids would work like they do in CSS and finally replace the need for nested auto-layout frames in Figma. Rows and columns should accept hug and min/max values, without it we’re left fidgeting with the numbers or simply continue using nested frames to handle layout grids.

I hope this makes it in the next update 🤞🏼