onlook

This project addresses the challenge of visually designing and editing React apps built with Next.js and TailwindCSS by integrating AI-assisted workflows directly into a browser-based visual editor. Unlike generic code editors or pure design tools like Figma, it combines real-time DOM editing, component detection, and AI chat to allow designers and developers to create, style, and iterate on UI components without switching contexts. The tool targets front-end engineers and designers who want to bridge the gap between design and implementation in React ecosystems. With over 26,000 stars and active commits as of June 2026, it shows solid community interest and ongoing development, though its growth signal is not yet notable. It is not suitable for teams working outside Next.js or TailwindCSS, as support for other frameworks and styling approaches is not yet available.

Use this tool when building or iterating on Next.js applications styled with TailwindCSS and you want a visual editor enhanced by AI to speed up design-to-code workflows. Consider alternatives like Webflow or Figma Make if you need broader framework support or if your project is not React-based, or Replit Agent if you want a more general AI coding assistant without the visual design focus.

Typically adopted by front-end teams creating customer-facing websites, prototypes, or internal dashboards that rely on Next.js and TailwindCSS. It fits workflows where designers and developers collaborate closely on UI components and want to experiment with branching and live previews without leaving the browser.

Latest commit: 2026-06-09. Activity data is based on daily RepoPi snapshots of the GitHub repository.