zoom_in Click to enlarge

Onlook

▲ ▼

language

description Onlook Overview

Onlook is an open-source visual editor for React applications that lets designers edit real React components on a visual canvas and write the changes back to the codebase. Its documentation describes visual editing, code integration, AI assistance, and Figma-to-Onlook workflows, with the project's code treated as the source of truth rather than a separate design mockup. It is intended for designers and developers who want a graphical way to change interfaces while retaining working React code. [Onlook React editor](https://www.onlook.com/for/react)

help Onlook FAQ

What can designers edit with Onlook?

Onlook lets designers edit real React components on a visual canvas. The changes can be written back to the application code instead of remaining only as a static design mockup.

Does Onlook work with React code?

Yes. Onlook is designed around React applications and connects visual editing with the existing component codebase. That makes it different from a design-only tool such as a standalone Figma file.

Can Onlook replace Figma?

Not completely. Onlook focuses on editing a running React interface and integrating changes with code, while Figma remains a broader collaborative design and prototyping tool.

Does Onlook include AI assistance?

Onlook documentation describes AI assistance as part of its workflow. It also covers Figma-to-Onlook workflows, visual editing, and code integration for React projects.

swap_horiz

Looking for Onlook alternatives? Compare top competitors ranked & scored

arrow_forward