Overview
Your Figma properties panel, on any live website, and every change you make becomes a brief your coding agent can execute. Live at designmode.app: 100+ users, free, open source. Constraint: zero telemetry, so I only know how it's used because someone told me.
The problem
This one I found by being annoyed at my own desk, every day, for months.
| Problem | What it costs |
|---|---|
| Lengthy context prompts | "On the homepage, in the overview section, change that button's text to…", I'm describing a location in prose to a machine looking at the same page I am. Tokens burn before the work begins. |
| Blind iteration | You spend the tokens, wait, and only then find out whether it's what you wanted. The feedback loop runs the wrong way round. |
| Vendor lock-in | My stack is open, opencode, my own API keys. Most coding-agent tooling isn't. Tools that only work if you buy the whole ecosystem aren't tools, they're leases. |
The insight underneath all three: designers already inspect front-ends to file UI issues. That behaviour exists, it's universal, and it's completely thrown away, the moment you close DevTools, everything you just worked out evaporates into a ticket written in prose. Don't teach a new behaviour. Capture the one that's already happening.
What I built
A visual editor on the live page. Anything you'd tweak in Figma, layout, typography, colour, spacing, copy, the DOM itself, you tweak here, with real controls. Then the changes are recorded and handed to your coding agent as a diff.
Free · open source · agent-agnostic · design-system aware. It ships to Claude Code, Codex, Cursor, Windsurf, or any MCP-compatible agent.
Figma's own Claude-to-canvas round-trip validates the direction. This removes the friction from it, you don't leave the live product to do it, and you don't pay a vendor for the privilege.
The unexpected use
The thing I didn't design for, which is now one of the reasons people keep it:
My teammates export annotations and changes. Developers import them as a CSS injection. The fix brief writes itself.
No agent involved at all. I built a designer→AI bridge and people are using it as a designer→developer one. That's the same insight paying out twice, the value was never the AI, it was capturing the intent at the moment and place it's formed, instead of translating it into prose and losing half of it.
Where it stands
100+ users · zero telemetry · zero marketing.
Zero telemetry is a decision, not an omission. It's a tool that sits on top of whatever page you're looking at, including your own unreleased product. A tool with that much access has no business phoning home, so it doesn't, and I gave up my own analytics to keep that true. Everything I know about how it's used, I know because someone told me.
Which does mean: I'm flying blind on usage, on purpose. It's the trade-off I'd most want to argue about, and I'd make the same call again.
The other thing I built
"Oh, I know something that does this." Everyone says it. So there's a page for that, a page on the site that answers the comparison before it's made, in public, with the actual differences. If your product's positioning only survives when you're in the room to defend it, it doesn't have positioning.
What I'd do differently
- No telemetry means no funnel. I can't tell you where people drop off, only that they stay. I chose privacy over insight and I'd choose it again, but I won't pretend it's free.
- Zero marketing is not a strategy: it's a thing I haven't done yet.
- The design-system awareness is shallow, it reads tokens where they exist, but it doesn't yet stop you from picking a value that isn't in the system. Following the system and enforcing the system are different products, and I've only built the first one.