Edit React visually while the AI keeps the code honest. Wild.
Onlook
Visual code editor for designers working in real codebases
Product badge
Share this product's name and rating in your README or on your website.
Updates may be delayed by image caching.
About Onlook
Onlook is a visual code editor for designers and product managers. It lets teams design together directly in their real codebase, with AI assistance for editing and implementation.
The editor works with live React components on an infinite canvas and can use a team’s Storybook design system. Onlook describes the code as the source of truth and is open-source.
Highlights
- Edit live React components visually
- Work directly in existing codebases
- Infinite canvas for visual editing
- Supports team Storybook design systems
- Open-source
Design-to-code loop finally feels two-way.
Similar tools
ChatGPT
— AI assistant for answers, writing, images, work, and codeAI assistant for answers, writing, images, work, and code

Claude
— AI assistant for research, coding, writing, and everyday workAI assistant for research, coding, writing, and everyday work
Cursor
— AI coding agent for building softwareAI coding agent for building software

Claude Code
— An AI coding agent for terminal, IDE, web, and SlackAn AI coding agent for terminal, IDE, web, and Slack

GitHub Copilot
— AI coding assistance across editors, GitHub, and the CLIAI coding assistance across editors, GitHub, and the CLI
CapCut
— Free AI-powered video editor for short-form creatorsFree AI-powered video editor for short-form creators