Install
npx -y @figwright/mcp@latestWho it's for
If you want an AI agent to do more than "look" at Figma — to connect to the official plugin through a local WebSocket relay, both read designs and write the canvas — this free two-way MCP matches. It targets Claude Code, Cursor, Codex, and any MCP client. There are 113 tools covering read, write, and grounding, so an agent can implement from a design and also build on the canvas. It runs on Figma's free tier, unlike the official Dev Mode MCP that needs a paid seat. It fits local design collaboration. It does not fit calling write tools without the desktop app or when the plugin is disconnected, and it does not fit treating the unnamed 113 tools as a known API. The summary says data stays on this machine; reading files and writing the canvas are still a local privacy boundary, not "no local reads".
First try in 3 minutes
First confirm an MCP client, the Figma desktop app, and Node.js 20.19+ or 22.12+. Official copy says Node 18/21 and 22.0–22.11 are unsupported; the server is pulled separately by npx, and that version may differ from the Node used to build the project. The free tier is enough, but importing the plugin needs the desktop app. The main client config is:
npx -y @figwright/mcp@latest
No global install is required. After start, import the plugin in Figma desktop as the repo describes, and confirm the local WebSocket relay is connected. Do a low-risk read first: pick a read-only or grounding tool from the client list and inspect the current selection or page structure. Evidence does not name the 113 tools; if they are missing, call the list, and do not invent a layer API. Success signal is a returned design structure, not a rewritten canvas. You must see a successful read before writing the canvas. Optional npx skills add awdr74100/figwright/skills is not the main path, and the skill requires MCP already connected. Repository: https://github.com/awdr74100/figwright
Use cases
Case 1: Implement from a design. After the plugin is connected, use read/grounding tools to understand the framework-aware design structure, then produce code on this machine. The title says designs can become framework-aware code. Evidence does not write which framework names are supported; if they are missing, follow the structure the client returns, and do not invent an export format.
Case 2: Write results back to the canvas. When an agent should build in Figma or push code back, use canvas-write tools. This changes the design file and has side effects: first confirm the current file is a disposable copy or one you explicitly want to change, then run. Evidence only guarantees two-way, not read-only; there is no undo step. On failure, rely on Figma history; do not invent an undo command.
Limits
Without the desktop app you cannot import the plugin, so the relay cannot connect. Do not force-run on an unsupported Node version. The 113 tool names are unpublished; do not invent them. Writes change the canvas; do not batch-write before a successful read. The paid limits of official Dev Mode MCP do not apply to Figwright, but Figwright is also not a stand-in for an official Figma seat. The skill pack is an add-on and does not replace @figwright/mcp. Do not assume the agent cannot see your design files. The first try only uses npx -y @figwright/mcp@latest; success is one read-only structure return.