Design → Code

Onlook

OSS visual React editor — designers edit code directly

Onlook is a free, open-source visual React editor described as "Cursor for designers." It lets designers edit React code visually while seeing the real component output. Changes sync bidirectionally with the code. Best for teams with designers who want to contribute to React projects without learning to code.

freeVisit website

Overview

Need Help With Prompts?

Our Prototype Assistant can help you generate optimized prompts for Onlook.

Start Chat

Related Tools

Canva Code
Canva Code is part of Canva's Visual Suite — it generates interactive web experiences from prompts using Canva's design engine. No coding required. Part of the same platform as Canva's design tools. Best for non-technical users who already use Canva and want to add simple interactive elements.
Kombai
Kombai is an AI agent specifically designed for real-world frontend development tasks — it understands UI patterns, component structures, and design systems to generate production-quality frontend code.
Magic Patterns
Magic Patterns is an AI prototyping tool that generates UI from prompts and imports design systems for consistent styling. It helps product teams quickly generate UI variants, gather feedback, and test new features. Best for product teams that need to iterate on UI ideas fast with design system alignment.