🖼️ → ⚛️ Screenshot to React

Upload a screenshot of a UI. Gemma 3 27B IT VLM with the gemma-3-27b-it-vlm-react-screenshot-to-code LoRA adapter writes a React component, and it renders live below.
256 4096
0 1.5
0.1 1
1 1.5
Upload a screenshot and hit  Generate  — the rendered React lands here.

The preview runs the generated code in a sandboxed iframe with React 18, Babel standalone, Tailwind 3.4, framer-motion and lucide-react. import statements are rewritten onto those globals, and the default export is mounted behind an error boundary — compile and runtime errors show up in a red banner. The adapter was trained for only 26 steps, so treat output as a scaffold to edit, not finished code.

The 27B base is ~55 GB, so the first request after the Space wakes has to load it before anything generates. Each run also uses a full-size ZeroGPU slice, which draws 2× daily quota — signed-out visitors get roughly one generation per day.