onlook

Onlook is an open-source, AI-powered visual editor for building websites — specifically apps built with Next.js (a popular React framework) and TailwindCSS (a utility-first styling system). It positions itself as "Cursor for Designers," meaning it brings the AI-assisted coding experience of tools like Cursor to people who prefer working visually rather than writing code by hand.

You can start a project from a text prompt or an image, then visually drag, resize, and restyle elements using a Figma-like interface (Figma is a popular design tool). At any point, you can inspect the real code behind any element, edit it directly, or let the AI chat make changes for you. The editor shows your live app in a preview pane alongside the code, so changes are immediate. You can deploy the finished app with a shareable link or connect a custom domain.

Under the hood, Onlook loads your project's code into a sandboxed web container, instruments the code to map visual elements back to their source locations, and syncs edits bidirectionally between the visual layer and the actual files. The tech stack includes Next.js, TailwindCSS, Supabase for the database and authentication, Drizzle as a database interface, and Bun as the runtime. AI features are powered through OpenRouter. It is available as a hosted app at onlook.com or can be run locally.