26.7k stars · Apache-2.0 · v0.2.32 (2025-07-17)
Click an element in a live preview, nudge the padding, and it writes the change back into the React source file.
▶Repo detailsthe review · specs · pros & cons · install
What it is
An open-source visual editor for React and Tailwind projects: you click an element in a live preview, adjust padding, colour, size or text, and the change is written back into your source files. It also has an AI mode for larger edits.
Why it matters
You build everything through Claude Code, which is excellent at structure and completely blind to "that heading sits four pixels too close to the rule." That specific gap — seeing a problem you cannot describe precisely enough to fix in words — is what this closes. Nudge it by eye, and the diff lands in the repository where Claude Code picks it up on the next task, so nothing is trapped in a canvas. The realistic caveat: it is happiest with Next.js and Tailwind projects, so how cleanly it grips Grasppy depends on what that app is actually built from. That is a thirty-minute experiment, not a week's migration.
- Edits map back to source files, so the visual tool and the codebase stay the same thing.
- Apache-2.0, and the project is moving fast with a large community.
- Solves precisely the non-designer-with-a-codebase problem, which almost nothing else does.
Runs on the Mac against the React front end's source tree.
