Figma just changed Auto Layout

Figma just changed Auto Layout to behave more like CSS, and a million designers and developers breathed a sigh of relief.

When have you had a problem after design signoff and before launching a finished product?

Designers and developers know this hurdle well. A design can appear perfectly resolved in Figma while requiring developers to add workarounds to reproduce it.

On the 24th of July, Figma announced an updated Auto Layout model intended to reduce differences between how layouts behave in Figma and how they behave in CSS. New frames use the updated model automatically, while existing frames remain on the legacy version unless converted.

This sounds like a small tooling change, but it tackles a persistent product-development problem that causes:

• Avoidable handoff conversations
• Inconsistent responsive behaviour
• Extra frontend implementation time
• Designs that degrade between approval and production

Figma is not simply becoming more developer-friendly. Because now designers can create layouts using rules that more closely reflect how the finished interface will actually behave.

What grows or shrinks? What wraps or truncates? What happens when real content replaces placeholder copy? How does the component behave across different breakpoints? They're all things we're aware of when we're designing. But every one of us has come up against a challenge when I finished build isn't quite what we all imagined it would be.

The best handoffs do not rely on developers translating a static design into a functioning product. They begin with designers and developers working from a more shared understanding of the same layout rules. Anything that closes that gap is a welcome update, in my opinion.