sketchpad-mcp 1.0.0

MCP server that opens a drawing canvas in the browser and returns the sketch as an image

sketchpad-mcp

A visual input tool for AI coding agents. You sketch; the agent reads the sketch.

Most MCP drawing tools go agent → human (the agent generates a diagram for you to view). This one goes the other way: human → agent. Open a canvas, draw your idea, and the resulting image lands directly in the agent's context.

---

How it works

1. The agent calls open_canvas (or you ask it to: "open the canvas, I want to sketch this")
2. A drawing tab opens in your default browser — powered by Excalidraw
3. You sketch, paste, or annotate
4. Click Send to Claude — the PNG is returned directly to the agent
5. The tab stays open; the agent can call the tool again and your drawing is still there to refine

---

Requirements

• Python 3.10+
• Claude Code (CLI)

---

Installation

1. Clone and install dependencies

git clone https://github.com/kennycornellius-collab/sketchpad-mcp.git
cd sketchpad-mcp
pip install -e .

2. Register with Claude Code

claude mcp add sketchpad --transport stdio --scope user -- python -m sketchpad_mcp

Use the python from the environment where you ran pip install (e.g. the absolute path to your venv's python). Alternatively, the install provides a sketchpad-mcp console command you can register instead of python -m sketchpad_mcp.

3. Verify it's registered

claude mcp list

You should see sketchpad in the list.

---

Usage

Once registered, the tools are available in any Claude Code session.

Let the agent decide — Claude Code will open the canvas on its own when your description is ambiguous or visual.

Ask explicitly:

"Open the canvas, I want to sketch the layout."

"Draw me a rough wireframe and send it over."

The canvas tab stays alive across calls in the same session — you can refine the same drawing across multiple back-and-forths without losing your work.

---

Tools

open_canvas

Opens the Excalidraw canvas and returns the sketch as a PNG image directly into the agent's context.

Use this when the agent can accept images (Claude Code always can).

Optional parameter: hint — a short reminder shown above the canvas (e.g. "Sketch the dashboard layout").

describe_sketch

Same canvas flow, but returns the PNG plus a prompt asking the agent to describe what you drew — the description is produced by the agent's own vision, no extra API key needed.

Use this when you want a reusable text representation of the sketch alongside the image — useful for saving the description to a file or passing it to a non-vision step later. Requires a vision-capable agent (Claude Code always is).

---

Canvas controls

The canvas is a full Excalidraw instance — shapes, arrows, text, freehand, colors, undo/redo all work. A few things specific to sketchpad-mcp:

• Send to Claude — submits the current canvas state as a PNG
• Close tab — closes the browser tab when you're done with the session. If the agent is waiting on a sketch, closing the tab (button or browser X) tells it immediately that you've declined, instead of leaving it waiting for the timeout

---

License

MIT. See LICENSE.

Built with assistance from Claude Code. Excalidraw embedded via CDN under its MIT license.

---

Other clients

sketchpad-mcp uses standard MCP stdio transport, so it should work with Cursor, Zed, Claude Desktop, and any other MCP-compatible coding agent. If you try it on one of those and want to help document the setup, feel free to open an issue or reach out — happy to add verified setup snippets for other clients.