Onlook: a visual editor that edits your Next.js and Tailwind code, not a mockup

Which Onlook this repository actually is

The first thing to settle is scope, and the README settles it in a note near the top: this is the open-source visual editor that started Onlook, built around Next.js and Tailwind, while the hosted product the team is building next for AI-native designers is in early access through a waitlist. The repository also links a job posting for founding engineers.

That distinction matters for anyone choosing to adopt. You are not getting early access to the new product by cloning this repository, you are getting the previous generation of the editor, self-hosted, Apache 2.0 licensed, with its own roadmap.

What it does is described in one line in the README: an open-source, visual-first code editor for crafting websites, prototypes and designs with AI in Next.js and TailwindCSS, where edits happen directly in the browser DOM. The audience is a team where design and code are already the same artifact, or want to be.

How a DOM click becomes a code change

The README gives a seven step description of the architecture, and it is worth reading closely because everything else follows from it. When you create an app, the code is loaded into a web container. The container runs and serves it. The editor receives the preview link and displays it in an iFrame. The editor then reads and indexes the code from the container, instruments that code to map elements to their place in the source, and when an element is edited, applies the change first in the iFrame and then in code. The AI chat has its own code access and tools.

The instrumentation step is the load-bearing part. Plenty of tools show a live preview next to a file tree; connecting a clicked element back to the exact JSX that produced it, reliably enough to rewrite it, is the hard problem, and it is what makes the visual editing real rather than a screenshot overlay.

The README states the architecture could theoretically scale to any language or framework that displays DOM elements declaratively, naming jsx, tsx and html, and says the team is focused on making it work well with Next.js and TailwindCSS for now. Treat that as a statement of intent, not of support.

Running Onlook locally with Docker and Bun

You can use the hosted app at onlook.com, or run it yourself following the running-locally page in the documentation at docs.onlook.com/developers/running-locally. The repository is a Bun-managed monorepo, and the root package.json defines the entry points:

"dev": "bun --filter @onlook/web dev",
"docker:up": "docker compose up -d"

The Docker path is the more contained one. The Compose file defines a single service, exposing the web client on port 3000 and reading its environment from a file inside the app directory:

services:
  web-client:
    build:
      context: .
      dockerfile: Dockerfile
    env_file:
      - apps/web/client/.env
    ports:
      - "3000:3000"
    restart: unless-stopped
    network_mode: host

Bringing it up is the usual Compose command:

docker compose up -d

The image is built from oven/bun:1, installs dependencies with bun install --frozen-lockfile, builds a standalone client, exposes port 3000 and defines a health check that fetches localhost:3000. There is also a setup:env script in the root package.json for generating environment files, plus database scripts for generation, push, seed, migrate and reset, which tells you a running instance is more than one container.

The roadmap gaps that decide adoption

The README carries a feature checklist with unchecked items, and those matter more than the checked ones when you are deciding. Under visual editing, component detection is done, having moved over from the separate Onlook Desktop project, but a drag-and-drop components panel is not. Under collaboration, real-time editing is shipped and comments are not.

Two unchecked groups are decisive. Advanced AI capabilities: images as references and assets, setting up and using MCPs in projects, and letting Onlook use itself as a tool call for branch creation and iteration are all open. Advanced project support: non-Next.js projects and non-Tailwind projects are both open.

Read together with the architecture note, the picture is a tool that is deep on one stack and narrow by choice. If your frontend is Vue, Svelte or plain HTML, Onlook is not for you today, and there is no partial path: the mapping layer is built for declarative DOM in the Next and Tailwind idiom.

Hosted generation tools are the alternative

The README names its own competition: Bolt.new, Lovable, V0, Replit Agent, Figma Make and Webflow. The honest distinction is about where the source of truth lives.

Those tools start from a prompt and generate a project, usually in their own hosted environment, with the code as an output you can export. That is fast for getting from nothing to a demo, and it tends to produce a codebase you did not design, with structure you have to learn before you can maintain it. Several are subscription services, and the design file or prompt history is the artifact you keep.

Onlook starts from code you already have and treats that code as the truth. You import a Next.js and Tailwind project and edit it visually, with branching to experiment and checkpoints to save and restore, and the result is a change in your repository rather than a new project somewhere else. The cost is that you must already be on its stack, and you must run it: the Compose file expects an external network named supabase_network_onlook-web, so self-hosting means standing up the Supabase side too.

Figma belongs in a different comparison. It is a design tool whose output is a handoff, while Onlook's output is a diff.

Stack, licence and upkeep

The stack is modern and specific. The front end is Next.js with TailwindCSS and tRPC for the server interface. Persistence is Supabase for auth, database and storage with Drizzle as the ORM. On the AI side the README lists the AI SDK as the LLM client and OpenRouter as the model provider.

Licensing is Apache 2.0, which is permissive and includes an express patent grant, making it a comfortable base for commercial use of the editor itself. Self-hosting also means operating the pieces it depends on, and Supabase is the significant one, since the Compose file expects an external network for it rather than defining it.

Maintenance signals point in two directions. The most recent releases in the list are v0.2.31 and v0.2.32, both published on 2025-07-17, and v0.2.29 on 2025-04-24, whose notes show a steady stream of editor fixes such as inconsistent text colour when entering edit mode, duplicating an already duplicated page, brand colour naming, an image manager refactor and a file watcher for modified open files. The last push was on 2026-08-25. Versions are in the 0.2 range and the team has stated its focus is the hosted product, so anyone building on this repository should be ready to maintain it themselves.

Editorial conclusion

Take Onlook if you already build in Next.js and Tailwind and want designers or less code-confident teammates to change real source through a Figma-like interface, with checkpoints, branching and an AI chat that has code access. Skip it if your project is not Next.js and Tailwind, since support for anything else is unchecked on the roadmap, or if you want the hosted AI-native product the team is now building, because this repository is explicitly the editor that started Onlook rather than that product. Before investing, stand up the Compose stack and confirm the editor can index and write back to one of your own pages, since that round trip is the entire proposition.

Frequently asked questions

Official sources

1. License: Apache-2.0
2. onlook-dev/onlook on GitHub
3. Project website
4. README
5. Releases