UIForge AI
UIForge AI treats visual pixels as geometric constraints that map to a clean, recursive, componentized React tree. Rather than guessing what a button looks like, it aims to measure the design and output exact code, solving the designer-to-developer handover.
- Started
- 2026
- Stack
- TypeScript, React, Vision models, AST
- Kind
- Open source
- Source
- Public
Why I built it
The design-to-code handover is where productivity dies: designers work in high-fidelity tools like Figma while developers retype by eye, and most AI UI generators output monolithic, unmaintainable code no engineer would commit.
What it does
- Parses a screenshot geometrically, mapping each element to a coordinate-based bounding box
- Infers the layout engine (Flex, Grid, or Block) from spatial relationships rather than guessing
- Generates a strictly typed UI Abstract Syntax Tree, the way a compiler does, and extracts colors, spacing, and typography into a design system
- Runs a multi-stage deterministic pipeline that emits a componentized React tree
How it is built
A multi-stage pipeline combining vision-based geometric parsing, structural deconstruction, a typed UI AST, and design-token extraction to produce React components.
How it evolved
- 2026Scoped
The design-to-code handover is where productivity dies: designers work in high-fidelity tools like Figma while developers retype by eye, and most AI UI generators output monolithic, unmaintainable code no engineer would commit.
- 2026Built
A multi-stage pipeline combining vision-based geometric parsing, structural deconstruction, a typed UI AST, and design-token extraction to produce React components.
- 2026Shipped
Built as a working prototype.
Built by Syed Tasavour. More at syedtasavour.com.