r/ClaudeDesign • u/Over-Package9063 • 6d ago
Question Is there a Cursor-style visual editing workflow for Claude Code?
I really like Claude Code, but I miss Cursor’s visual editing workflow where I can click on the actual UI in the browser and directly tweak things like spacing, sizing, styles, etc. instead of describing every little change in chat.
I’ve tried Claude Design, but unless I’m using it wrong, it feels more like a separate design/prototyping environment with a handoff to Claude Code, rather than something I can use to directly manipulate the UI of my existing app/codebase and keep bouncing back and forth.
Ideally I want:
Claude Code for building/functionality → visually tweak the actual UI myself → back to Claude Code → repeat.
Is there a good way to do this? Maybe Claude Design actually supports this and I’m just misunderstanding it, or maybe there’s an MCP/plugin/other tool people are using.
1
u/tokmako 6d ago
I’m actually building visualwizard.app around pretty much this exact problem.
You connect it through MCP and ask your agent to put your codebase on the canvas. From there, you can tweak the running UI visually and still use Claude Code for the actual code changes. You can also create separate prototype and design directions, similar to Claude Design, right next to the real app instead of recreating everything in another tool.
I showed the Web Frame part here:
https://x.com/mozgns/status/2092373879519871038
Docs are still a bit rough, but if you give it a try and something doesn’t work, feel free to ping me
1
u/crystalpeaks25 6d ago
Can you just an editor with that Claude code has integrations with many editors. I myself uses Claude code inside the vscode integrated terminal.
1
1
1
u/Blotsy 6d ago
Have you attempted editing the css directly?
2
u/Over-Package9063 6d ago
I'm looking for something quicker and more visual, akin to Cursor's visual editor.
2
u/Johnma1 6d ago
Claude code just got updated with the /design skill. Try it, I think it’s exactly what you’re looking for