A live architecture board you and your coding agent draw on together.The agent draws what it builds. You read the board, not a prose summary.
Docs · Install · What to ask · Demos · Examples · What leaves your machine
claude plugin marketplace add redcrayonai/draw && claude plugin install draw@redcrayonai
One request replayed hop by hop (play_trace). By redcrayon.
Ask your agent in plain words:
- "Add rate limiting to the public API. Draw what you change on a Draw board."
- "Draw how this repo fits together. Cite a line for every edge."
- "Drop the unused customers.name column. Flag the migration and cite every reader."
- "Pods in checkout keep restarting since 14:00. Lay out what you find on a scratch board."
- "Mark what this SIEM alert and scanner report affect, and tell me what to fix first."
The agent opens a board named after your branch, posts the link, and keeps it current as it works.
Install
Claude Code (drawing skills, automatic code refs, and private board chat):
/plugin marketplace add redcrayonai/draw
/plugin install draw@redcrayonai
Start a new Claude Code session, then /mcp → draw → Authenticate,
and run /draw:navigate. Open the board link to continue in private chat.
Board chat needs Node 22+ and Claude Code hooks for MessageDisplay and asyncRewake.
~/.cursor/mcp.json:
{ "mcpServers": { "draw": { "url": "https://mcp.redcrayon.ai/mcp" } } }
Cursor Settings → MCP, click login next to draw.
codex plugin marketplace add redcrayonai/draw && codex plugin add draw@redcrayonai
Use a Codex version with plugin support. Start a new session, connect Draw when
prompted, and ask it to open a board. You can also install Draw from /plugins
after adding the marketplace.
Board chat needs Node 22+ and access to the same conversation through a shared
Codex app server. If chat cannot attach, continue in Codex; drawing still works.
Setup, existing connections, and MCP-only fallback.
The upcoming native executable installs one Draw plugin with
draw install codex. Ask "create a draw board" to start locally, or explicitly
ask for a hosted board. Existing board links keep their backend. One shared set of
permissions covers local and hosted access.
Native setup, defaults, and permission changes.
Customize → Connectors → Add custom connector, name it draw, paste https://mcp.redcrayon.ai/mcp, Connect. claude.ai draws from the conversation; code refs need a coding agent in your project.
Give it https://mcp.redcrayon.ai/mcp. Every client signs in once, in the browser.
Code refs without the Claude Code or Codex plugin: when a tool needs a capture of your checkout, it tells the agent the exact command, and the agent runs it. Nothing to install; Node 20+ and git on PATH.
npx -y @redcrayonai/draw@1 doctor # check node, git, repo, network
What to ask
| Ask | You get |
|---|
| Watch it build"Add rate limiting to the public API. Draw what you change." | The components it is about to change, drawn before the first edit. Every edge cites the line that proves it; every symbol it touches has a code ref. |
| Give feedback"Listen for my red crayon marks and answer each one on the board." | Circle a node, add a note and press Send. The agent replies with changed files or a reason to keep the code. Walkthrough. |
| Propose a design"Branch this board, draw the queue proposal, and submit it for review." | A separate diagram to review before a person merges it. Walkthrough. |
| Review a risky change"Drop customers.name. Flag the migration and cite every reader." | The migration flagged on the database. A reader it did not update shows as one that will break. |
| Map a codebase"Draw how this repo fits together. Cite a line for every edge." | An onboarding map, left to right, each box with a two-sentence doc. Share it as a view link. |
| Watch local traffic"Start a tap while I exercise checkout locally." | Measured traffic, latency and errors on the request path. Needs Node 22 and OpenTelemetry traces. Examples. |
| Investigate an incident"Checkout pods keep restarting. Lay out what you find." | Charts beside the services they describe, each saying where its data came from. Pairs with a Grafana or Kubernetes MCP server. |
| Triage security findings"Mark what this alert and scan affect. What do I fix first?" | Compromised and vulnerable services marked, each with its blast radius. Explain the priority using exposure, evidence and sensitive downstream systems. |
| Explain it to someone"/draw:make-it-make-sense why the rename takes three releases, for product" | A walk-through on the board: a few boxes shown in order, one plain sentence each, one telling per audience. Readers press Play walk-through. Walkthrough. |
Review a risky change
Migration 0042 replaces customers.name with display_name. The board shows the table's new shape, the step that can't be undone, and the one reader the change missed: the welcome email still selects name. Code refs open the exact lines.
Open the demo board → Catppuccin Mocha theme
여기까지가 README 앞부분입니다. 나머지는 원문에서 읽을 수 있습니다. README 전문 보기 ↗
