Figma introduces LayoutFlow: generative layout engine that respects design systems

Design · 5 min read

LayoutFlow plugs into a file's existing styles, tokens and components to output multiple layout variants for a selected frame. Designers can set goals like "maximize scannability" or "prioritize CTA" and receive instant drafts that keep spacing, grid and typography rules intact.

The feature includes a feedback loop: designers can accept, tweak, and re-run LayoutFlow which uses those edits to shift its subsequent proposals. Figma says this preserves design intent and avoids the common pitfall of AI-generated layouts that ignore a project's established constraints.

Integration extends to handoff: generated frames come with spec-ready measurements and suggested component states. Early users report a significant time savings during early-stage exploration, though power users caution that LayoutFlow should be used as a starting point rather than a replacement for nuanced manual layout decisions.