UI to JSON

UI to JSON turns Figma frames into a clean, semantic JSON AST designed forAI-assisted frontend code generation — not pixel-perfect HTML dumps.

Most Figma-to-code tools spit out noisy markup full of absolute positions,brittle class names, and missing intent. AI agents choke on it. This plugintakes the opposite approach: it extracts **design intent** — hierarchy,auto-layout, components, variants, and design tokens — and normalizes it intoa structured intermediate representation that LLMs and code generators canreason about reliably.

What it does- Extracts semantic layout (direction, alignment, gap, padding)- Recognizes components, variants, and instances- Normalizes design tokens: colors, typography, spacing, radius, shadows- Cleans layer naming into stable semantic identifiers- Exports JSON + an optional markdown context file for prompt grounding- Lets you exclude noisy layers by nameBest for- Developers using Claude, Cursor, or GPT to generate UI from designs- Design system teams who want their Figma library as a structured spec- Anyone building deterministic design-to-code pipelinesSelect a frame, click Extract, copy the JSON into your agent's context.

Everything runs locally — no network access, no telemetry, no account.