Now in Alpha Release
Code as you design
Onlook writes reliable code you can trust, exactly where it needs to go
Layers
Side menu
Primary navigation
Opener
H2
Welcome to your Dashboard
Overview
Client Logo
Actions
Share
New project
Projects section
Controls
Filter
Sort
Project • 12 instances
Get into the details
Adjust layouts, change colors, modify text, and more. No setup required.
Collaborate in real-time
Share a live link to the real app. See your changes made instantly.
Sharing
Share this design
Live Preview Link
https://mango-trees-free.loca.it
Preview Link Password
**********************
Settings
Stop Sharing
Variables
Assets
Color Styles
blue-100
blue-200
blue-300
blue-400
blue-500
blue-600
blue-700
blue-800
teal-100
teal-200
teal-300
teal-400
Teal / 500
Teal / 600
Teal / 700
Teal / 800
Variables
Assets
Text Styles
title1
36/Auto
title2
24/Auto
title3
20/Auto
largePlus
18/140
large
18/140
regularPlus
15/140
regular
15/140
smallPlus
13/140
small
33/140
microPlus
11/Auto
micro
11/Auto
Coming Soon
Design that scales
Use the design system you've already built with your code.
Maintain version-control
how you want
Roll-back anytime – We never ship your code to production.
Your environment means
your security
Configure your environment to your requirements – Onlook works with your setup.
Code confidently, locally
All of your code stays on your device – it never leaves your machine.
Works with your existing
build process
No adding new components.
No migration necessary.
Audit Onlook at any time
Visit our GitHub repo and peak under the hood to see how we're building Onlook.
Open-source &
actively supported
