Figwright

What awdr74100/figwright MCP server does

The awdr74100/figwright MCP server gives coding agents two-way access to Figma. It can inspect a selection, document structure, nodes, styles, variables, components, fonts, reactions, motion state, screenshots, image-fill assets, and exported PDF or video files. On the writing side, it can create or modify frames, text, shapes, auto-layout settings, effects, styles, variables, components, pages, reactions, and Motion animations.

The server is intended for workflows where design and implementation need to stay connected. An agent can turn a selected Figma design into code using design context, or build a design from a description or code-oriented request. The available tools include component, token, and icon mappings so generated code can reuse structures already present in the codebase. A design-diff tool compares a design with a saved baseline and reports what changed.

How it works

The awdr74100/figwright MCP server runs as a local Node process and communicates with an MCP client over standard input and output. A Figma plugin provides the other side of the connection, using a local WebSocket relay to pass tool calls between the client-facing server and Figma.

The server, relay, and plugin run on the local machine, and the README states that designs are not sent elsewhere. Multiple MCP clients can share one plugin; they select a leader to own the active plugin connection. The transport is designed to recover from dropped WebSocket connections. The plugin also displays tool activity, payloads, connection health, versions, and diagnostic information.

The published tool catalog contains 112 MCP tools, grouped into reading, writing, and grounding functions. The MCP client remains the authoritative source for the currently available tool list.

Setup and configuration

Install the awdr74100/figwright MCP server in an MCP client with Node.js 20.19 or newer, or Node.js 22.12 or newer. Node 18, Node 21, and Node 22.0 through 22.11 are not supported. The documented stdio configuration runs npx -y @figwright/mcp@latest, so a global installation is not required.

Figma is also required. The free Figma tier is sufficient, but the Figma desktop application is needed to import the plugin. Download the plugin archive from the latest GitHub release, unpack it, and import its manifest.json through Figma's development-plugin menu. Open the plugin after adding the MCP server; it connects to the local server automatically. Running the ping tool provides a basic connection check.

Optional skills are available for code generation and design building. They can be installed with the documented npx skills add awdr74100/figwright/skills command, but they require the MCP server to be connected and do not provide tools independently.

Tools and capabilities

Read operations include:

• Inspecting selections, documents, nodes, styles, variables, components, fonts, reactions, and animation state.
• Capturing screenshots and retrieving original image-fill assets.
• Exporting documents as PDF and animated frames as MP4, GIF, or WebM.

Write operations include creating and editing visual nodes, layout, effects, design tokens, components, pages, reactions, and Motion timelines. Component authoring covers boolean, text, and instance-swap properties. The batch tool applies multiple edits in one operation.

Grounding operations provide de-duplicated design context and mappings between Figma data and a codebase. These mappings help code generation reuse existing components, tokens, and icons rather than treating every selection as standalone markup.

Limitations and notes

The plugin is distributed through GitHub releases rather than the Figma Community marketplace. Figma desktop is required for importing it. The project is designed for local operation and uses the plugin as part of its connection path; the MCP server alone does not provide Figma access without that plugin. Client compatibility depends on MCP support, and the client-visible tool list can change as the project evolves.