Fimake
Provides tools for AI agents to read, create, edit, and organize content in Figma documents, including frames, text, components, instances, layout, colors, prototype links, and asset exports.
Click on "Deploy Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@Fimakelist the pages in this Figma file"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Fimake
Problem
The official Figma MCP server is read-only. You cannot change anything in the Figma document with it. Chatting in Figma Make and then moving the result back to Figma to continue is inconvenient.
Fimake lets AI agents work directly in your Figma documents — create, edit, organize, and read.
Related MCP server: FreeMCP for Figma
Install for users (5 minutes, no repo clone)
Prerequisites: Node.js >= 22, Figma Desktop, an MCP client (Claude Code / Cursor / Claude Desktop).
1. Install the Figma plugin (sideload, once)
Fimake ships as a dev plugin (sideload from manifest). There is no Figma Community listing — the plugin needs a local socket bridge (localhost:10101), which Figma does not allow for published listings. This is the same model as other MCP bridges.
Download
fimake-plugin.zipfrom GitHub Releases and unzip it.In Figma: Plugins > Development > Import plugin from manifest, select
manifest.jsonfrom the unzipped folder.Run it via Plugins > Development > Fimake. Expected: Not connected to MCP server.
Keep the plugin window open. It flips to Connected once the MCP server (step 2) is running.
Compatibility: use the plugin zip and the npm package from the same release (e.g. both
v1.0.0). Default port is10101on both sides.
2. Run the MCP server (pick one)
A. Standalone binary (recommended, no Node needed). Download fimake-<your-os> from GitHub Releases (fimake-macos-arm64, fimake-linux-x64, fimake-windows-x64.exe), make it executable (chmod +x fimake-* on macOS/Linux), then point your client at it:
{
"mcpServers": {
"fimake": {
"command": "/absolute/path/to/fimake-macos-arm64",
"env": { "TRANSPORT": "stdio", "PORT": "10101" }
}
}
}B. From source (contributors, Intel Macs). Clone, build once, point at the local file (needs Node.js >= 22):
git clone https://github.com/chavisnguyen/FiMake.git
cd FiMake && make install && make build{
"mcpServers": {
"fimake": {
"command": "node",
"args": ["/absolute/path/to/FiMake/mcp/dist/index.js"],
"env": { "TRANSPORT": "stdio", "PORT": "10101" }
}
}
}Where to put the config:
Claude Code / generic client / Inspector: paste into your MCP config.
Cursor:
~/.cursor/mcp.jsonor project.cursor/mcp.json.Claude Desktop:
claude_desktop_config.json.
Then restart the client if it requires it and ask something like "list the pages in this Figma file". The plugin window should show the task appear and settle (Task started: get-pages ... → Task finished: ...).
Alternative: streamable-http (advanced)
Use this only if your client requires an HTTP endpoint (or you want the Inspector over HTTP). You run the server yourself and point the client at a URL:
TRANSPORT=streamable-http ./fimake-macos-arm64
# serves http://localhost:10101/mcp{
"mcpServers": {
"fimake": { "url": "http://localhost:10101/mcp" }
}
}Full client configs, env table, and custom PORT checklist live in docs/usage.md.
Guide | When to read it |
Full setup, HTTP + | |
| |
Contributor guide: |
Tools
27 tools: 23 forward directly to the plugin (name = task command), 4 have extra Node-side logic.
Tool | Side | Description |
| plugin | Create a rectangle. |
| plugin | Create a frame. |
| plugin | Create a text. |
| plugin | Create an instance. |
| plugin | Create a component. |
| plugin | Clone a node. |
| plugin | Add a component property. |
| plugin | Add a prototype interaction (click to navigate) between two nodes. |
| plugin | Lean layout/colors/content. |
| plugin | Get all pages in the current file. |
| plugin | Get all components in the current file. |
| plugin | Move a node. |
| plugin | Resize a node. |
| plugin | Set the fill color of a node. |
| plugin | Set the stroke color of a node. |
| plugin | Set the corner radius of a node. |
| plugin | Set the layout of a node. |
| plugin | Set the parent id of a node. |
| plugin | Set the properties of an instance. |
| plugin | Edit a component property. |
| plugin | Set the component property references of a node. |
| plugin | Delete a node. |
| plugin | Delete a component property. |
| node+plugin | Get the current selection in Figma. No params; returns whole TaskResult. |
| node+plugin | Fetches |
| node+plugin | Rendered asset with real path data ( |
| node-only | Fans out over |
Contract parity is enforced by mcp/tests/contract/mcp-tools.test.ts and NODE_ONLY_TOOLS in mcp/src/tools/registry.ts.
Install for contributors
make install # pnpm install (mcp + plugin)
make check # pre-push gate: typecheck + lint + test + build
make dev-mcp # watch + restart the MCP server
make dev-plugin # watch + rebuild the plugin (re-import it in Figma to reload)See docs/development.md for the full guide. After a plugin rebuild, re-import it in Figma — Figma does not hot-reload the bundle.
Architecture
Socket.IO is the bridge between the MCP server and the Figma plugin.
MCP server runs a Hono (Node) server with MCP endpoints plus a Socket.IO server for the plugin.
It saves tool calls into a task map and sends start-task over WebSockets with ack + retry queue.
The Figma plugin listens on the WebSocket, dispatches via TOOL_HANDLERS, runs the Figma API, and returns the result.
Only page-fan-out tools call figma.loadAllPagesAsync(); single-node tools skip it.
Timed-out tasks resolve isError:true. Stale queued messages expire via TTL + max retries. StreamableHTTP creates one McpServer per client session sharing a single Figma bridge, so sessions can't leak into each other.
flowchart TB
subgraph Server["MCP Server (Node: Hono + Socket.IO)"]
MCP["MCP endpoint<br/>/mcp + /health"]
Bridge["Figma bridge<br/>task map + ack + retry queue<br/>TTL + timeout"]
WS["Socket.IO server"]
MCP <--> Bridge
Bridge <--> WS
end
Agent["AI Agent<br/>Claude / Cursor / Inspector"] <--> MCP
Plugin["Figma Plugin<br/>TOOL_HANDLERS + Figma API"] <--> WS
Plugin <--> FigmaDoc["Figma Document"]sequenceDiagram
participant Agent as AI Agent
participant MCP as MCP Server
participant Plugin as Figma Plugin
participant Figma as Figma API
Agent->>MCP: callTool(name, params)
MCP->>MCP: save task (map + TTL)
MCP->>Plugin: start-task via Socket.IO (ack + retry)
Plugin->>Figma: TOOL_HANDLERS[name](params)
Figma-->>Plugin: result
Plugin-->>MCP: task-finished / task-failed
MCP-->>Agent: ToolResult (isError:true on timeout)Security
The plugin gives AI agents access to your open Figma document, similar to the official Figma MCP server. It runs on your local machine and does not send data anywhere else by itself — exposure depends on which AI client you connect.
Local use is the default. For any networked use, set
CORS_ORIGINexplicitly, reviewnetworkAccess.allowedDomainsinplugin/manifest.json, and proceed at your own risk.export-file/export-assetwrites are confined to the requested output dir (no../escape, no filesystem-root writes, frame count + byte caps).
Found a security issue? Please report it via GitHub issue.
Alternatives
If your tasks are read-only, use the official Figma MCP server.
A known community alternative built on the same plugin-plus-socket idea is cursor-talk-to-figma-mcp (plain JavaScript, separate socket server). Fimake differs with TypeScript, a single server (MCP + bridge on one PORT), and contract-tested tools.
This server cannot be deployed
Maintenance
Related MCP Connectors
The Figma MCP server brings Figma design context directly into your AI workflow.
Connect AI coding agents to Anima Playground, Figma, and your design system.
- mcp-serverOAuthcom.make
Give your AI agents the tools to build, manage, and run automation workflows.
Access and maintain design system docs, tokens, components, skills, and contexts across any project.
Related MCP Servers
- FlicenseCqualityDmaintenanceLocal bridge enabling AI agents to inspect and edit the currently open Figma Desktop file through the Figma Plugin API.291-
- AlicenseNot gradedqualityBmaintenanceEnables AI coding agents to read and write a user's Figma file through the Figma Plugin API, offline and privately, without API tokens or rate limits.68 npmMIT
- AlicenseNot gradedqualityBmaintenanceEnables AI coding assistants to draw UI directly on a Figma Desktop canvas and read existing designs back as structured JSON, tokens, CSS, and screenshots, all over a localhost bridge without external API keys.78 npmMIT
- AlicenseNot gradedqualityAmaintenanceEnables AI agents to inspect Figma selections, navigate pages, render previews, generate starter code, and submit user-approved canvas edits through a local bridge.3 npmMIT