Onlook
A visual editor that lets designers and product managers craft, edit, and ship web experiences directly in the codebase. Integrates with AI for faster iteration and collaboration.
Onlook is an open-source alternative to:
Onlook is a visual code editor designed for designers and product managers, enabling them to craft, edit, and ship web experiences directly within their existing codebase. By bridging the gap between design and development, Onlook streamlines collaboration and accelerates the design-to-development workflow.
Key Features
- Visual Editing in Codebase: Edit and design directly within the real codebase, eliminating the need for design-to-code handoffs.
- AI-Powered Assistance: Leverage AI to generate, refine, and iterate on designs and components in real-time.
- Collaborative Workflow: Enable seamless collaboration between designers, product managers, and developers in a shared environment.
- Real-Time Preview: Instantly preview changes and iterate without switching between tools or waiting for builds.
- Component Library Integration: Sync with existing component libraries for consistency and reusability.
- Version Control Friendly: Works natively with Git, ensuring changes are tracked and versioned alongside the code.
- Customizable Workspace: Tailor the editor to fit individual workflows and preferences.
- Export-Ready Output: Generate clean, production-ready code and assets directly from the visual editor.
Tech / Self-Hosting
Onlook is a cloud-based tool with a self-hosted option available for teams requiring full data control. The open-source repository provides the foundation for self-hosting, allowing organizations to deploy Onlook on their own infrastructure. The tool is built with modern web technologies and integrates seamlessly with existing development workflows.