Builder.io's /visual-edit is a free, open source skill that opens a running local app inside an Agent-Native Design surface, rendering routes as iframe-backed screens that teammates can inspect, duplicate, and edit directly on a Figma-style canvas . It is aimed at developers who already work with coding agents like Claude Code, Codex, Cursor, or Windsurf and want to make UI tweaks visually instead of describing them in prose, with changes flowing back into source files through whichever agent they prefer. The canvas stays wired to the app's real routes and a local bridge rather than a static mockup , so what you edit is what ships.
The launch matters because coding agents have mostly been driven through chat, and the review loop for visual work has lagged behind. Builder's skills repo now bundles /visual-edit alongside /visual-plan (turning text plans into rich visual plans) and /visual-recap (turning diffs into interactive visual recaps) , pointing at a workflow where humans and agents hand off through visual artifacts rather than walls of markdown. The skill is model and agent agnostic, installed via a single CLI command, and supports multiplayer sessions so designers and engineers can be on the same canvas at once.
The release comes from Builder.io, the visual development company founded and led by Steve Sewell, who posted the launch and has been shipping a series of agent skills under the BuilderIO/skills and BuilderIO/agent-native repositories. For teams already running an AI coding stack, /visual-edit is worth a look as a way to bring Figma-like direct manipulation to local apps without locking into a specific editor, framework, or model.
Comments (7)
Sign in to join the discussion.
P
Priya Vaidya9d ago
ok wait, Figma canvas but it edits my actual repo? my designers are either going to love me or finally take my job.
T
Tomas L.9d ago
the demo cut where you drag a button and the code refactors is doing a LOT of heavy lifting. show me the ugly tailwind soup afterwards and I'll believe it.
R
Roshan D.9d ago
the thumbnail with the two cursors moving in sync is the only reason I stopped scrolling. whoever edited this earned their paycheck twice.
N
nadia writes9d ago
"visually code together" is fine but "your canvas is the codebase" slaps harder. free of charge, use it or don't.
K
Kenji Morita9d ago
shipped something adjacent to this at a big G in 2019 and leadership killed it for "scope ambiguity." glad someone outside the mothership actually got it out the door.
W
wambui k.9d ago
hot take: this is the last visual builder that will ever ship without being 100% agent-driven. in 6 months nobody will click anything, they'll just vibe at their laptop.
M
Marek Ziolko9d ago
building my own version of this for 3 weeks now, guess I'm forking yours instead. shipping is a skill I will acquire eventually.
Work With Us
Book an intro call to explore our suite of services. We might have a waitlist.
Builder.io
visually code together
visually code together
Tags
TLVC Rating
Community Rating
No ratings yet
to rate this launch.
Builder.io's /visual-edit is a free, open source skill that opens a running local app inside an Agent-Native Design surface, rendering routes as iframe-backed screens that teammates can inspect, duplicate, and edit directly on a Figma-style canvas . It is aimed at developers who already work with coding agents like Claude Code, Codex, Cursor, or Windsurf and want to make UI tweaks visually instead of describing them in prose, with changes flowing back into source files through whichever agent they prefer. The canvas stays wired to the app's real routes and a local bridge rather than a static mockup , so what you edit is what ships. The launch matters because coding agents have mostly been driven through chat, and the review loop for visual work has lagged behind. Builder's skills repo now bundles /visual-edit alongside /visual-plan (turning text plans into rich visual plans) and /visual-recap (turning diffs into interactive visual recaps) , pointing at a workflow where humans and agents hand off through visual artifacts rather than walls of markdown. The skill is model and agent agnostic, installed via a single CLI command, and supports multiplayer sessions so designers and engineers can be on the same canvas at once. The release comes from Builder.io, the visual development company founded and led by Steve Sewell, who posted the launch and has been shipping a series of agent skills under the BuilderIO/skills and BuilderIO/agent-native repositories. For teams already running an AI coding stack, /visual-edit is worth a look as a way to bring Figma-like direct manipulation to local apps without locking into a specific editor, framework, or model.
Comments (7)
ok wait, Figma canvas but it edits my actual repo? my designers are either going to love me or finally take my job.
the demo cut where you drag a button and the code refactors is doing a LOT of heavy lifting. show me the ugly tailwind soup afterwards and I'll believe it.
the thumbnail with the two cursors moving in sync is the only reason I stopped scrolling. whoever edited this earned their paycheck twice.
"visually code together" is fine but "your canvas is the codebase" slaps harder. free of charge, use it or don't.
shipped something adjacent to this at a big G in 2019 and leadership killed it for "scope ambiguity." glad someone outside the mothership actually got it out the door.
hot take: this is the last visual builder that will ever ship without being 100% agent-driven. in 6 months nobody will click anything, they'll just vibe at their laptop.
building my own version of this for 3 weeks now, guess I'm forking yours instead. shipping is a skill I will acquire eventually.