UI to JSON
Turn Figma frames into structured JSON your AI agent can actually use.
Plugin Preview
About this plugin
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.
Plugin Details
| Version | 1 |
|---|---|
| Created | May 19, 2026 |
| Last Updated | May 19, 2026 |
| Category | Software development |
| Creator | Binjo |
| Stats | 132 installs, 49 likes |
| Pricing | Free |
Technical Details
- API:1.0.0
- UI:dist/index.html
- main:dist/code.js
- Document Access:dynamic-page
- Editor Types:figma
- Allowed Domains:
- none
More Like This
Discover other plugins in the Software development category.
Builder.io - Figma to Code & AI Apps (React, Vue, Tailwind, etc)
Export designs to clean, responsive code or turn Figma screens into AI apps and prototypes.
Code Snippet Editor
Translate component variants, properties, and more into dynamic code snippets for your design system
GitHub
Connect Design to Code