Stability AI releases StableDesigner, a layout-aware image-to-UI model

Design · 5 min read

StableDesigner analyzes visual hierarchy, spacing, and typography to segment images into semantic layers (headers, nav, cards) and maps those to component primitives. Output formats include Figma .fig export, React JSX with Tailwind classes, and annotated PSDs, which designers can refine after generation.

The model emphasizes layout fidelity and accessibility: it flags contrast issues, recommends ARIA roles, and suggests keyboard focus orders. A tuning kit helps teams adapt the segmentation rules to their design systems, preserving brand-specific spacing or typographic scales.

Stability AI included a moderation layer to reduce propagation of copyrighted UI elements and provides a review sandbox that highlights high-similarity matches to known templates. The company envisions StableDesigner accelerating design-to-code handoffs for both small teams and studios.