[Config 2025] Grid Auto Layout Flow — let’s hear what you think!
I was very excited to hear that grids were coming to Figma. CSS Grid was introduced years ago and brought with it many things that flexbox was incapable of doing, so I was hoping for a similar level of new capabilities here, and I genuinely cannot believe that this feature is being shipped in its current state (even as a ‘beta’). This is a very long post, but I feel like this feature has been implemented so poorly that it legitimately sows doubt in Figma’s capabilities to deliver features in the future.
Inability to ‘hug’ contents
Both rows and grids themselves are unable to resize themselves to match their contents (‘Hug”).
Row heights must be either “Auto” (1fr) or a fixed height, meaning that if you want your rows to be sized per their elements, you’ve now manually defined each row height in px (not even a variable value), and instead of getting a clean CSS output, now you have however many rows defined in exact values, destroying any chance of scalability.
This alone makes this feature nearly useless to me.
‘Cannot remove row from a grid when it has content’
One of the great aspects of CSS grid is that, without having to do anything to the children of the grid, I can change the number of columns/rows and the grid will re-flow all the elements for me.
Figma does not do this. It will add rows/columns only if they are larger than current, but it will not remove rows/columns unless they are empty, so you have to manually move everything into the place you want, and then you are able to remove the extra rows/columns. This is an incredibly cumbersome way to handle this and immediately made this feature hard to use.
Why do I even need to define the number of rows?
One of my biggest gripes with Figma’s ‘Fill’ mode is that there are no percentage based widths. Say I want my items to take up 25% width, but I only have 3 items total, I now have to create an empty ‘spacer’ frame so that my design can stay responsive without manually setting pixel values
With grid, well now I can define my number of columns and get the nice percentage based widths I want, but I also have to define the number of rows, making it incredibly tedious, and since I can’t even set their heights automatically, I genuinely might still be better off just using horizontal auto layout with spacer frames.
Inability to select the elements in a row/column all at once
In all other areas of Figma, selecting a parent and hitting Enter will select all children. In grid, selecting a row/column and hitting enter only allows you to change the width/height, you must manually select each item one by one.
Table behavior
After I’ve manually selected each item in a row, now I’d like to create a new row, let me hit Cmd+D and... After I’ve manually selected each item in a row, now I’d like to create a new row, let me hit Cmd+D and...
oh. This also happens in reverse when selecting an entire column. Tables to me seem like the most obvious use case of grid, because managing tables in Figma has been a pain for years, you either get nicely sized rows, or nicely sized columns, but now trying to use Grid for table somehow creates an even worse experience. Duplicating a row grants you more columns, and duplicating a column grants you more rows. You have to manually add the row/column first before duplication, and then it will work as expected.
I sincerely hope that some of these issues/limitations have already been addressed internally and are just not public facing yet. I’m very disappointed in this release, as Figma has had years to approach their CSS grid implementation, and they’ve provided a solution that is obnoxious to use and far too limited in scope.
Subject line updated by a moderator and linked to new features post on May 9, 2025 — changed from “Grid for Auto Layout is horribly limited in scope and very awkward to use” to “lConfig 2025] Grid Auto Layout Flow — let’s hear what you think!”.]
Page 3 / 3
I can not use this until I can set a row to hug its content.
Hug contents sorely needed!
I’m not going to go into a ton of detail because the OP covered my gripes perfectly. I’ve given Grid a few chances, and after leaving it alone for a week I’ve come back to lay out a comparison table, aaaaaaaand…..it still sucks. Swing and a miss guys. I’m ignoring this until its improved.
hi
Is the new grid in Figma designed to be responsive only on Figma sites? If so, that’s a real letdown it shouldnt be in the Autolayout section. I was hoping to be able to resize the grid frame and have the tiles automatically rearrange themselves—like a true responsive layout.
It came out of the air fryer too early, and has a lot of potential.
I attempted to use Grids (beta) today to save time in creating a few new SaaS layouts, over different breakpoints. I hit these limitations:
Row height isn’t automatic (the ‘hug’ feature).
Unable to span content across multiple columns based on parameters (using the same grid for desktop/tablet/mobile – auto layout with wrap is still faster). Exploring min & max for columns could be interesting here.
Best practice for using frames inside of a cell is still murky. Auto layout within the frame, inside of a cell, could be seriously confusing for the uninitiated.
Selecting the cells wasn’t super smooth. In the Config demo, it looked a lot easier. Looking forward to that.
There was one success story – using grid to hold multiple images within a card component was easy (4x2 grid). People creating marketing site type layouts might benefit more from the beta. Less useful for SaaS and really not useful for responsive atm. I like where it’s going though .
Adding my +1 to all of this
Halfbaked feature, I agree with everything else posted here.
+1 to all
Unbelievable Figma release such crap feature.
Just copy Framer or Penpot already, I can see Figma been the next Invision, only time will tell.
The biggest complaint on the grid feature that I have found currently is when trying to organize the contents of a grid of differently sized items. Not only are the items not actually sorted other than in the layers list, when you use the layers list to move a new item into that grid, it does not get placed in between the items where you moved it in the layers list. Also, the grid does not appear to organize items in an alphabetical order, which is something I would expect, especially considering that the other auto-layouts do this function.
I like the concept of the new grid layout, but I would rather to have the previous grid layout back over the current iteration.
New grid auto-layout is the worst thing I ever used. You shouldn’t remove “wrap” auto-layout. Content doesn’t fit automatically in grid, I have to do it manually.
There is so much awesome potential for Grids to shape the way we design and use our design system. It would be great if the layout of the grid could change responsively. We are working on layout modules that have a different view for desktop, which is a horizontal layout and vertical for mobile. Adding a way to make the columns change based on size or another variable width would be helpful.
New grid auto-layout is the worst thing I ever used. You shouldn’t remove “wrap” auto-layout. Content doesn’t fit automatically in grid, I have to do it manually.
Wrap is still there. It just only shows when you select “Horizontal” in the Flow section.
Grid Auto Layout – What’s Next?
We appreciate all of you
Hi all! First, big thank you to everyone who took time to share feedback on Figma Grid. During Config 2025, we were ecstatic to share all the work we’ve done to make it happen.
Your input really helped us understand where things are working — and where things can improve — across different workflows, use cases, and team sizes. The purpose of this post is to give you a reflection of every user who's utilized Figma Grid, and what we’re doing to improve the experience.
️ Top Common Concerns and Limitations
The ability to “Hug Contents” for columns and rows Grid columns and rows are not able to adjust dynamically to fit or “hug” their content. This causes rigid layouts and requires manual resizing.
Missing smart item swapping Reordering items between columns and rows was a slow and tedious process. Drag-based swapping was expected, but not available in grid.
Adapting content when adjusting grid size Previously columns and rows could not be removed unless they were empty, prompting an error message. Ideally, when columns are removed, remaining content should shift to fill available space. To circumvent, designers need to move or delete contents before they could adjust the size of their grid
Lack of variable support for gaps Designers are not able to apply variables to grid gaps, making it harder to maintain spacing across different grids and files.
What we're doing to address these things
Here’s what we can share so far:
Hug contents. This is one of the most requested features. We’re actively working on adding “Hug” resizing options for columns, rows, and grid containers.
Item swapping. You can now swap items within the grid if they span the same number of cells. This better mirrors expectations of auto layout behavior.
On-canvas column and row deletion with content. The ability to delete a select column or row directly from the canvas, even if it contains objects, has been live for several weeks. If items span multiple cells, their span will shrink accordingly.
Content reflow behavior. We’ve updated the grid picker so that content now shifts when columns and rows are removed. This improves responsiveness and makes layout changes more intuitive.
Variables support for gaps. You can now apply variables to the space between columns and rows. This allows for more scalable and consistent spacing across design systems.
We know what we’ve recapped above may not cover everything you’re looking for, and we encourage you to keep the conversations going. Whether it’s about Figma Grids, or any other Figma product, please engage with us (and each other) in these spaces:
Tip: try running a search in our forum to see if there are existing threads that are similar to your thoughts. Our community is a great place to have conversations, and you may find existing information that helps.
Thanks again for being part of the Figma community!
I may be using it for the wrong thing, but I keep trying to use grid for data tables. In that scenario I often need to add a row/column. My instinct is to select the row/column and Command+D to duplicate, same as I would do with an autolayout. Today, that completely duplicates the grid.