cursor-talk-to-figma-mcp: AI-Driven Figma Control via Model Context Protocol
TalkToFigma: MCP integration between AI Agent (Cursor, Claude Code, Codex) and Figma, allowing Agentic AI to communicate with Figma for reading designs and modifying them programmatically.
At a glance
- What is it?
- cursor-talk-to-figma-mcp connects AI coding agents such as Cursor and Claude Code to a live Figma document through a WebSocket bridge and a Model Context Protocol server. The agent can read design data and modify elements programmatically without leaving the coding environment.
- Who is it for?
- Designers and developers who prototype or automate design tasks with Cursor or Claude Code and want the AI agent to read and modify Figma documents directly should look at cursor-talk-to-figma-mcp. Teams that only need to read Figma data programmatically and do not use an MCP-compatible AI agent can interact with Figma through its REST API directly instead.
- Can I use it commercially?
- Yes. MIT is a permissive licence: you can use, modify and sell software built on it, as long as you keep its copyright and licence notices.
- Is it still maintained?
- Yes. The repository last received commits 66 days ago.
- What is it written in?
- Mainly JavaScript, according to GitHub's language statistics.
Answers come from the project's GitHub data, last synced on September 17, 2026, and from our analysis. They are not legal advice.
Editorial analysis
What cursor-talk-to-figma-mcp Does and Who It Is For
cursor-talk-to-figma-mcp is an integration layer between AI coding agents and Figma. The README describes it as 'a Model Context Protocol (MCP) integration between AI agent (Cursor, Claude Code) and Figma, allowing AI agent to communicate with Figma for reading designs and modifying them programmatically.'
The use case is design automation from within a coding environment. An AI agent working on a codebase can, without switching tools, query the current Figma design for layout values, create or rename elements, update text content in bulk, apply fill colors, set up auto-layout, or export assets. This closes the loop between the design file and the code that implements it.
The project is structured as three components: a TypeScript MCP server in src/talk_to_figma_mcp/, a Figma plugin in src/cursor_mcp_plugin/, and a WebSocket server in src/socket.ts. The AI agent connects to the MCP server, the MCP server connects through the WebSocket to the Figma plugin, and the Figma plugin acts inside the Figma application. All three must be running simultaneously for the integration to work.
Version 0.3.5 is available on npm as cursor-talk-to-figma-mcp. The package.json identifies it as an ESM module with a binary entry point, meaning it can be run directly with bunx.
WebSocket Bridge Architecture
The design choice to use a WebSocket bridge is what makes this integration possible. The Figma plugin API runs inside the Figma application and cannot be called directly from an external server. The Figma plugin communicates with whatever is listening on a local WebSocket port. The MCP server connects to that same port. The result is a relay: the AI agent sends a command to the MCP server, the MCP server forwards it via WebSocket to the Figma plugin, the plugin executes it inside Figma, and the response travels back the same way.
The Dockerfile in the repository exposes port 3055, which is where the WebSocket server listens. This port needs to be accessible from both the MCP server and the Figma plugin. On a standard desktop setup the three components all run locally and port 3055 is on localhost. On Windows with WSL, the default localhost binding does not cross the WSL boundary, which is why the README includes a dedicated Windows/WSL guide that sets the hostname to 0.0.0.0.
The README also documents a channel-based connection system: the Figma plugin connects to the WebSocket server by 'joining a channel' using the join_channel tool. This suggests multiple Figma documents or multiple agents can share a single WebSocket server instance, each operating on a different channel.
This architecture means the tool is local-first. Unlike a cloud-based design API, everything runs on the user's machine. The trade-off is that all three components must be started manually and kept running for the duration of a session.
Installation and MCP Configuration
Bun is required. Install it with:
curl -fsSL https://bun.sh/install | bashThen run the setup script from the repository root, which installs the MCP server into Cursor's active project configuration:
bun setupStart the WebSocket server:
bun socketFor manual MCP configuration, add the server to Cursor's MCP configuration at ~/.cursor/mcp.json:
{
"mcpServers": {
"TalkToFigma": {
"command": "bunx",
"args": ["cursor-talk-to-figma-mcp@latest"]
}
}
}The Figma plugin must also be installed. It is available on the Figma community page at the URL in the README, or it can be linked locally by going to Plugins, Development, New Plugin, then choosing 'Link existing plugin' and pointing to src/cursor_mcp_plugin/manifest.json.
On Windows with WSL, the installation uses PowerShell for Bun: powershell -c "irm bun.sh/install.ps1|iex", and src/socket.ts must be edited to uncomment the hostname: "0.0.0.0" line before starting the WebSocket server.
MCP Tools: Reading and Modifying Figma Documents
The MCP server exposes over forty tools. They are organized by function.
Document and selection tools let the agent inspect the open document: get_document_info returns metadata about the current file, get_selection returns information about what is currently selected, read_my_design returns detailed node information for the selection without requiring node IDs, and get_node_info and get_nodes_info fetch data for specific node IDs.
Layout modification tools cover the full auto-layout system: set_layout_mode sets a frame to NONE, HORIZONTAL, or VERTICAL; set_padding sets padding values; set_axis_align controls primary and counter axis alignment; set_layout_sizing sets sizing modes (FIXED, HUG, or FILL); set_item_spacing controls gap between children.
Styling tools include set_fill_color for RGBA fills, set_stroke_color for stroke color and weight, set_corner_radius with optional per-corner control, and set_image_fill for filling a node with a local file, URL, or base64 image.
Text tools address bulk operations: scan_text_nodes uses intelligent chunking for large designs, set_text_content updates a single text node, and set_multiple_text_contents batches text updates efficiently. A contributed bulk text replacement feature, credited to @dusskapark in the README, enables replacing text across many nodes with a single command.
Component tools cover get_local_components, create_component_instance, get_instance_overrides, and set_instance_overrides. The set_instance_overrides and get_instance_overrides pair supports a contributed instance override propagation feature, also from @dusskapark, which copies component instance overrides from a source instance to multiple target instances at once.
Prototype tools include get_reactions to fetch all prototype connections from nodes, and create_connections to draw FigJam connector lines based on prototype flows or custom node mappings.
Limitations and Failure Modes
The three-component architecture creates several failure modes. If the Figma plugin is not running and connected, every tool call from the MCP server will fail or hang. If the WebSocket server is not started, neither the plugin nor the MCP server can communicate. The MCP server itself must remain running for the AI agent to issue commands. In practice, starting a session requires launching three separate processes and verifying they are all connected before asking the AI agent to act.
The last push to the repository was on 2026-07-26, approximately two months before this review. The repository has no GitHub releases; the npm package at version 0.3.5 is the current published artifact.
The tool coverage is strong for layout and text operations but partial for some Figma features. The README's tool list covers annotations, prototyping connections, and export operations, but complex Figma features such as variables, branching, or design system token editing are not mentioned.
The WebSocket architecture also creates a restriction for multi-monitor or multi-file workflows. The channel system allows connecting to different documents, but the setup documentation does not describe running multiple Figma files simultaneously with separate channels in a single session. Teams with complex multi-document workflows will need to experiment with channel management.
The Docker deployment path, suggested by the Dockerfile, exposes port 3055 and runs only the socket server, not the full integration. Container deployment separates the WebSocket server from the user's desktop where Figma runs, which only works if the container can reach the Figma plugin's host machine on port 3055.
MCP vs Figma REST API: Different Approaches
Figma exposes a REST API for reading file data. The REST API allows fetching node trees, styles, and components from any Figma file given an OAuth token, without running any local server. It does not require Bun, a Figma plugin, or a WebSocket relay.
cursor-talk-to-figma-mcp differs in two ways. First, it supports writing, not just reading. The REST API is read-only for production files. cursor-talk-to-figma-mcp, through the plugin API, can modify the live document. Second, it integrates with MCP-compatible AI agents, giving the agent structured tool definitions it can call by name rather than requiring the agent to construct HTTP requests to the Figma REST API itself.
For workflows where an AI agent needs to actively modify a design in real time, responding to prompts like 'change the button label in this frame' or 'apply the primary color to all selected rectangles,' this integration is more direct than the REST API route. For workflows that only need to read design data and export it to code, the REST API or existing Figma-to-code plugins may be simpler to set up.
The Figma community plugin ecosystem also includes plugins that export Figma designs to CSS, React components, or other code formats. Those plugins do not require an MCP server or an AI agent to function. cursor-talk-to-figma-mcp is specifically valuable when an AI agent needs to drive the design modifications interactively, not when the goal is a one-time export.
Repository Layout, MIT License, and Maintenance
The top-level structure is clear: src/ holds the TypeScript source (talk_to_figma_mcp/ for the MCP server, cursor_mcp_plugin/ for the Figma plugin, socket.ts for the WebSocket relay), dist/ holds compiled output, scripts/ holds setup utilities, and smithery.yaml suggests integration with the Smithery MCP server registry.
The dependencies in package.json are minimal: @modelcontextprotocol/sdk at version 1.13.1, uuid, ws (for WebSocket), and zod at 3.22.4. The devDependencies use tsup as the bundler and TypeScript 5.x. The build output is a single compiled server.js.
The CLAUDE.md and AGENTS.md files in the repository root suggest the project was developed with AI coding assistance and has instructions for AI agents contributing to the codebase itself. The DRAGME.md file is not described in the README.
The license is MIT. Commercial use, modification, and redistribution are permitted. The npm package name cursor-talk-to-figma-mcp matches the repository name, making the public installation straightforward via bunx cursor-talk-to-figma-mcp@latest.
The last push was 2026-07-26. The repository has no GitHub releases; version 0.3.5 is tracked through the package.json version field and the npm registry.
Editorial conclusion
Designers and developers who prototype or automate design tasks with Cursor or Claude Code and want the AI agent to read and modify Figma documents directly should look at cursor-talk-to-figma-mcp. Teams that only need to read Figma data programmatically and do not use an MCP-compatible AI agent can interact with Figma through its REST API directly instead. Before setting up, verify that Bun is available or can be installed, and confirm that the Figma plugin can be installed either from the community page or built locally from src/cursor_mcp_plugin/manifest.json.
Frequently asked questions
What does MCP enable Cursor to do with Figma?
Through cursor-talk-to-figma-mcp, MCP gives Cursor structured tools to read and modify a live Figma document: querying node properties, creating elements, updating text content in bulk, setting fill colors and auto-layout, and managing component instances. The agent calls these tools by name without the user manually scripting Figma API calls.
What does MCP mean in the context of Figma?
MCP stands for Model Context Protocol, a standard for exposing tools to AI agents. In cursor-talk-to-figma-mcp, an MCP server defines the Figma operations the agent can call. The server relays those calls through a WebSocket to a Figma plugin running inside the Figma desktop application.
Is there an MCP plugin for Figma?
cursor-talk-to-figma-mcp provides both an MCP server and a companion Figma plugin. The Figma plugin is available on the Figma community page and can also be installed locally by linking src/cursor_mcp_plugin/manifest.json through Figma's development plugin menu.
How do you run MCP on Cursor with this project?
Add the server to ~/.cursor/mcp.json with the TalkToFigma entry pointing to bunx cursor-talk-to-figma-mcp@latest, or run bun setup from the repository root which performs that configuration automatically. The WebSocket server must also be started separately with bun socket.
Official sources
Add this badge to your README
If you maintain this project, the badge below links readers to this analysis and shows its maintenance status from the daily GitHub snapshot. Paste the markdown into your README; add ?metric=license or ?metric=stars to the image URL for a different field.
[](https://hysenlabs.com/projects/grab-cursor-talk-to-figma-mcp)