All posts

Why we built Canvashand, a Figma MCP server for AI agents

Why we built Canvashand, the Figma MCP server for AI agents: what Claude Code, Cursor and Codex can do with it, how it works, and what it costs.

Canvashand is an MCP server and a Figma plugin that let AI agents read and edit the Figma files you have open. Your client, whether Claude Code, Cursor, Codex, or another MCP client, can call 99 tools. The plugin runs them on the live canvas.

Why we built it

Agents got good at code quickly. Design stayed a manual handoff. An agent could be asked to build a screen, but the design it worked from was often a screenshot or a read of a file, and fixing anything on the design side was still manual.

We wanted agents to build in Figma, not only read it. Draft a full product UI. Bind a token. Rename a hundred layers. Wire a prototype. Tell you which screen is missing a state.

The second problem is how agent work behaves. An agent does not make one call. It reads, edits, re-reads to check, and corrects, so one task is dozens of calls, and a team of subagents multiplies that. Per-seat read caps stall that kind of work partway through a task. So Canvashand Pro has unlimited calls, and Free includes 2,000 calls a month.

What your agent can do

  • Read the real canvas. Inspect frames, components, variables, styles, prototypes, and text straight from the open file.
  • Change exact properties. Create nodes and update layout, fills, type, variables, and component structure without flattening the design.
  • Ship faithful code. Give your coding agent the real structure of a frame, so it builds from your components and tokens instead of guessing from a picture. See Turn a Figma link into code that matches.
  • Design a full product UI. One session builds a theme, shared components, and screens, wires them into a flow, audits the result, and can be rolled back.
  • Work in several files at once. Each file keeps its own history, so subagents can work in parallel. See Several Figma files, several agents, one server.

All of that comes from 99 tools, covering reads, writes, styles, variables, components, prototypes, and design-session control.

Canvashand is also built for how developers already work. You do not leave your editor or terminal. You describe the change, the agent makes it in Figma, and you review the result in the file, where it is easy to correct. If something is wrong, rollback_changes deletes everything the session created. To undo edits to layers that already existed, restore the checkpoint that Figma version history saved when the agent opened the session with begin_change_session. Either way, trying an ambitious prompt costs little.

How it works

You run the Canvashand server on your own machine. Your AI client talks to it over MCP. The plugin, running in each Figma file you open, connects to the server and carries out the calls on the live document.

AI client ⇄ canvashand server (127.0.0.1:21994) ⇄ Figma plugin ⇄ your open files

Canvashand's cloud never receives your design data; it handles sign-in, billing, call counts, and client versions. Design data goes from the plugin to the local server on your machine, then to your AI client. Canvashand does not use the Figma REST API or a personal access token, so Figma's API rate limits do not apply.

Several Figma files can be open at once. Each file runs the plugin, all of them join the same local server, and each keeps its own change sessions and rollback history.

If you are choosing between Canvashand and Figma's own server, Canvashand vs the official Figma MCP server compares them with sources.

Pricing

Free includes 2,000 calls a month. Pro is $6.99 a month or $69.99 a year with unlimited calls. Every Pro plan starts with a 7-day free trial.

Try it

Follow the setup page to install the CLI, add the plugin, and configure your client in a few minutes. Then read Run AI agents and subagents in Figma for three prompts to start with and how a full design session runs.