Make Grids fully responsive with variables
Fractional units and hugs are definitely a welcome addition to Grids, but what’s still missing is the ability to assign both the number of columns/rows and colspan/rowspan to variables.
We’ve defined our website breakpoints as modes so we can build components that automatically adapt to the viewport (for example, a 50/50 layout that stacks on mobile). Right now, the only way to achieve this is by storing fixed column-width values for each breakpoint and use them in combination with horizontal auto-layout. It works, but it defeats the whole purpose of Figma’s grid system.
Assigning variables directly to the grid would allow every component using that grid to automatically adapt based on its current mode (breakpoint). This would make creating mockups across different breakpoints significantly faster and more efficient.