I’m working on a design project where I need to create responsive layouts that match how CSS grid systems work. I want to show developers exactly how the interface should look at different screen sizes.
The problem is that I can’t seem to make Figma’s auto layout behave like a proper grid system. When I try to set up columns that should resize based on screen width, I run into constraint conflicts.
Specifically, I notice that when a child element has horizontal constraints set to “Scale” and vertical constraints set to “Hug contents”, the parent container can’t also use “Hug contents” for its vertical constraint. This creates layout issues.
Is this a known limitation in Figma? Are there any plugins or workarounds that can help create grid-based responsive designs? I really need to communicate responsive behavior to my development team, but creating separate frames for each breakpoint seems like a poor solution.
Has anyone found a good way to handle this kind of responsive design specification in Figma?