Onlook for React
The open-source visual editor
for React.
Onlook works on your real React codebase — any framework, any component library, any styling system. Designers compose with the components your engineers ship. AI helps. Every change is real code in your repo — not an export, not a separate file format, not a parallel design system.
One codebase, one source of truth
React was designed around components. Your team has spent months — maybe years — building a component library, refining theme tokens, settling on patterns. Onlook respects all of that. It reads your existing components and uses them as the design canvas. No second library to maintain. No drift between the mockup and the live product.
Other tools generate React snippets you have to copy in. Onlook works inside your repo. The thing on the canvas is the thing in production.
Works with your React stack
Real components
Every component on the canvas is a real component in your repo. No re-creation, no parallel design system, no drift.
AI-native
AI is built into every interaction. Generate, restyle, restructure on the canvas with natural language — without leaving your design environment.
Built on what you have
No new file format, no proprietary platform, no second source of truth. Onlook works with your real React stack — Storybook, Tailwind, shadcn, and the components your team already maintains.