A visual decision step for AI coding agents. When your agent hits a fork — which layout, which palette, which of three plans — it shows you a few rendered options in your browser instead of a wall of text. You click one. It builds on your choice.
Drop-in: no MCP server, no extension, nothing to install but the skill (it needs Node.js, which
Claude Code and Cowork already have). It runs in plain Claude Code or Cowork as a tiny local server
(~390 lines, zero dependencies) that binds to 127.0.0.1 by default — nothing leaves your machine.
Built on the Visual Companion from Superpowers by Jesse Vincent and the Prime Radiant team (MIT). The core mechanic is theirs; this is a neutral, themeable repackaging. See ATTRIBUTION.md. Not affiliated with Anthropic.
Some decisions are faster to see than to read. "Grey or gold? Four tiles or a sidebar?" — three paragraphs describing the options is slower and worse than three options you glance at and click. Visual Loop gives the human visual context + a small set of structured choices, captures the pick, and hands it back to the agent. Full speed everywhere else; a human at the junctions that count.
A personal note from the maintainer: I have ADHD. Left to myself I'll build the whole thing just to answer one question. Seeing a few options on screen and picking one is how I keep that in check — this tool is partly that habit, made shareable. Your mileage may differ; that's not a claim about how anyone else works.
Requires Node.js. No build step.
# install as a skill (works in Claude Code, Cowork, and other SKILL.md agents)
npx skills add mazorda/visual-loopThen just ask your agent to use it — "show me three layouts and let me pick." The agent starts the
server, you open the http://localhost:<port> URL it prints, click an option, and it continues.
Prefer to wire it by hand? Drop this folder into your agent's skills directory (e.g.
~/.claude/skills/visual-loop) and the agent will discover it.
From the agent's side it's a file loop; the browser talks to a local server over a WebSocket that's used only to push reloads and capture your clicks.
agent ──writes an HTML screen──▶ .visual-loop/<session>/content/*.html
│ (watched; newest screen wins)
local server (127.0.0.1)
│ wraps it in the themed frame, serves it
your browser ◀──http──┘ ──click──▶ WebSocket ──▶ server ──appends──▶ .../state/events
agent ──reads on its next turn──▶ .../state/events
The agent writes a screen, tells you the URL, and ends its turn. You click. On its next turn it reads your click from a file and builds on it. That's the whole thing.
Visual Loop is neutral by default and themeable.
--theme |
Look |
|---|---|
slate (default) |
Neutral dark — calm, un-branded |
paper |
Light, minimal, docs-like |
terminal |
Near-black, monospace, green accent |
signal-dark, ig-graphite |
Bundled example themes — copy them to make your own |
# pick a theme + white-label the header
start-server.sh --project-dir . --theme paper --brand "Acme"Add your own theme in about five minutes: copy a [data-theme] block in
scripts/frame-template.html, swap the colour tokens, and launch
with --theme your-name. See themes/README.md. The Inter font (OFL) is
bundled and served locally, so screens render identically on every machine and offline.
| Environment | Status |
|---|---|
| Claude Code (macOS/Linux) | ✅ Works |
| Cowork | ✅ Works (agent runs on the same machine as your browser) |
| Cursor | |
| Windows | |
| Other SKILL.md agents | Should work — it's just a skill + a local Node server |
- Versus terminal option-pickers (e.g. a
/pickskill that lists text choices): Visual Loop renders actual screens — palettes, layouts, mockups — not text rows. - Versus visual pickers built as agent extensions (e.g.
pi-design-deck,pi-visualfor the Pi agent): those are great, but you install them as extensions for a specific agent. Visual Loop is a drop-in skill that runs in plain Claude Code / Cowork with no extension and no MCP server. - Versus the MCP route (MCP Apps, MCP-UI, MCP Elicitation): the standard way to put real
interactive UI in front of an agent — MCP Apps shipped as an official MCP extension in early 2026.
These are server-backed: the UI is served from an MCP server (
ui://resources) or driven by a server-initiated elicitation. Visual Loop solves a narrower, no-server case. See below.
As far as we can tell — having searched the upstream author's repos, npm, and GitHub — this is the first standalone packaging of the Visual Companion, separate from the full Superpowers framework. If a prior one exists, open an issue and we'll credit it.
No — and it's not trying to replace MCP. MCP is the multi-vendor standard for connecting agents to tools, and for interactive UI there's MCP Apps. Visual Loop is orthogonal: a zero-plumbing local visual loop for when you just want to drop in a folder and let the human click. Reach for MCP / MCP Apps when you want a shared, server-backed protocol; reach for this when you don't want to stand anything up.
- Binds
127.0.0.1by default — nothing is uploaded, published, or exposed to the network. - The server renders HTML your agent writes into the session folder, on loopback only. Going
non-loopback (
--host 0.0.0.0, e.g. a remote container) is an explicit opt-in. - No telemetry, no accounts, no external requests — the bundled font is served locally.
- MIT. Built on the Visual Companion from Superpowers by Jesse Vincent and the Prime Radiant team — the core click-loop mechanic, including the zero-dependency hand-rolled WebSocket server, is their work. See ATTRIBUTION.md.
- Bundled font Inter (Rasmus Andersson) under the SIL Open Font License 1.1 —
scripts/fonts/OFL.txt. - Packaged and maintained by Mazorda.
- Not affiliated with, endorsed by, or sponsored by Anthropic. "Claude" and "Claude Code" are trademarks of Anthropic, referenced here only to state, truthfully, which environments this tool runs in. No claim of any rights in those marks is made or implied.