MCP Directory

How to add figma-use to Claude Desktop

Control Figma from the terminal or as an MCP server — full read/write: create shapes, text, components, render JSX, export images. Paste the config into ~/Library/Application Support/Claude/claude_desktop_config.json and restart Claude Desktop.

Last updated June 14, 2026 · 571★ · http · no auth

Claude Desktop config for figma-use

npm install -g figma-use
{
  "mcpServers": {
    "figma-use": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-remote",
        "http://localhost:38451/mcp"
      ]
    }
  }
}

Claude Desktop connects to remote servers through the `mcp-remote` proxy (installed on first run via npx). Restart Claude Desktop after saving.

Setup steps

  1. 1Open Claude Desktop → Settings → Developer → Edit Config (this opens ~/Library/Application Support/Claude/claude_desktop_config.json).
  2. 2Paste the figma-use config below under the top-level "mcpServers" key.
  3. 3Fill in any placeholder secrets (API keys, paths) in the snippet.
  4. 4Save the file, then fully quit and reopen Claude Desktop.
  5. 5Open a chat and confirm figma-use's tools appear under the 🔌 tools menu.

Before you start

  • Node.js with npm (install the `figma-use` package globally or run via npx)
  • Figma desktop app launched with remote debugging, e.g. `open -a Figma --args --remote-debugging-port=9222` (or `figma-use daemon start --pipe` for Figma 126+)
  • The MCP server running locally via `figma-use mcp serve`

What figma-use can do in Claude Desktop

figma_status

Check if Figma is connected.

figma_create_frame

Create a frame with layout (auto-layout or grid).

figma_create_rect

Create a rectangle.

figma_create_text

Create a text node.

figma_create_icon

Insert an Iconify icon by name.

figma_set_fill

Set the fill color of a node.

figma_set_layout

Set auto-layout or grid layout on a node.

figma_node_move

Move a node.

Security

Requires the Figma desktop app to be launched with remote debugging enabled (e.g. `--remote-debugging-port=9222`), which exposes a Chrome DevTools Protocol endpoint on localhost — only run this on a trusted machine. The MCP server has full read/write access to the open Figma file via the Plugin API. The MCP endpoint is served over local HTTP with no authentication, so do not expose the port beyond localhost.

figma-use + Claude Desktop FAQ

Where is the Claude Desktop config file?

Claude Desktop reads MCP servers from ~/Library/Application Support/Claude/claude_desktop_config.json. Paste the figma-use config there under the "mcpServers" key and restart the client.

Is figma-use safe to use with Claude Desktop?

Requires the Figma desktop app to be launched with remote debugging enabled (e.g. `--remote-debugging-port=9222`), which exposes a Chrome DevTools Protocol endpoint on localhost — only run this on a trusted machine. The MCP server has full read/write access to the open Figma file via the Plugin API. The MCP endpoint is served over local HTTP with no authentication, so do not expose the port beyond localhost.

How is this different from Figma's official MCP server?

Figma's official MCP plugin can read files but cannot modify them. figma-use has full read/write access and can create, edit, and export nodes via the Plugin API.

Do I need to install a Figma plugin?

No. figma-use connects to the Figma desktop app over the Chrome DevTools Protocol. You just start Figma with remote debugging enabled (e.g. `--remote-debugging-port=9222`).

What transport does the MCP server use?

The MCP server runs as a local process (`figma-use mcp serve`) and is added to your MCP client via a `url` pointing at a local HTTP endpoint such as `http://localhost:38451/mcp`. The port can be changed with `--port`.

View repo Full figma-use page