The Developer Tool for
Visual Engineers
Onlook is a free, local-first editor where
designers craft exceptional experiences in code
Villainterest - Product Notes
Save
Save
Save
Save
Save
Save
Save
Save
Save
Save
Save
Save
Savesyndicate
Unlimited lairs, private boards, and first look at every new scheme.
Sign up.jpg&w=828&q=75)
Save
.jpg&w=640&q=75)
Build the home feed — a masonry grid of lair inspiration
Done — the feed pulls from your Explorations board and fills in as new pins land.
Villainterest - Product Notes
SaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSavesyndicate
Unlimited lairs, private boards, and first look at every new scheme.
Sign upSaveBuild the home feed — a masonry grid of lair inspiration
Done — the feed pulls from your Explorations board and fills in as new pins land.
Design with AI on an infinite canvas
Craft, preview, and iterate with AI to ship better websites and prototypes faster than ever.
Villainterest - Product Notes
SaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSaveSavesyndicate
Unlimited lairs, private boards, and first look at every new scheme.
Sign upSaveBuild the home feed — a masonry grid of lair inspiration
Done — the feed pulls from your Explorations board and fills in as new pins land.
Native design tool features that work 1:1 with code.
A true developer tool for designers, helping you code without knowing anything about code.
Your product, your taste, real code.No mockups to rebuild, no creative limits.
The canvas is the app
Every frame is a working page, not a picture of one. What you design on is what users get.
Always design in sync
Design on the real product, not a copy of it. Your work never drifts from what ships.
Explore every direction
Spin up variations of an idea right on the canvas, then merge the ones that work.
Wield your creative system
Shape tokens, components, and styles visually. Your whole team builds with what you make.
Bring your inspiration
To steer your agents, drop screenshots, moodboards, and inspiration beside your live work.
Hotkeys you already know
Work at full speed from day one with the shortcuts you’re already familiar with.
Bring your AI subscription
Use the Claude or ChatGPT plan you already have. OpenCode and more are coming soon.
Skip the setup
Open a project and start designing right away. Onlook handles the rest.
Fits your stack
Keep how your team builds. Onlook works with your framework, components, and development process.
Ship it as code
To hand off, share a branch or an artifact. Your work is already code your team can review, remix, and merge.
Supported by you &
... other builders
Join the open source movement to bring
design and code together
Tens of thousands of
builders love Onlook
Frequently
asked questions
Yes, Onlook can be self-hosted for free on GitHub. For the hosted cloud version, please contact our team or book a demo. We are working closely with teams to set up the best internal design and code workflow, and are happy to help you get started.
You can prototype, ideate, and create websites from scratch with Onlook
When you design in Onlook you design in the real product – in other words, the source of truth. Other editors are great for ideating, but Onlook is the only one that lets you design with code using your existing design system instantly.
The code you make with Onlook is all yours. You can export it on your local machine, publish it to GitHub, or host it at a link
Onlook is a visual editor for code. It allows you to create and style your own creations with code as the source of truth. While it is best suited for creating web experiences, it can be used for anything visual – presentations, mockups, and more. Because Onlook uses code as the source of truth, the types of designs you can create are unconstrained by Onlook's interface.
Developers have historically been second-rate citizens in the design process. Onlook was founded to bridge the divide between design and development, and we wanted to make developers first-class citizens alongside designers. We chose to be open-source Onlook to give developers transparency over the tool, and make it as flexible as possible for the unique ways teams set up their code.