Use This MCP client To

Automate selection and editing of design objects in Figma Change fill and stroke colors of design elements programmatically Create basic shapes within Figma via natural language commands Export design nodes as PNG images automatically Integrate LLM-driven workflows with Figma design projects Prototype AI-assisted design editing and generation in Figma

README

MCP server for Figma client

This is an (unofficial) MCP server to let LLM clients interact with Figma's plugin API.

This is a very early version, so only a small subset of functionality is exposed:

object selection
change fill/stroke color
create basic shapes
export node to PNG.

Even these features aren't very robust, so it's not very reliable at this stage.

Please feel free to fork and submit PRs for improvements/features.

Prequisites & installation

Figma plugin

node >= v20.18.1

git clone git@github.com:nmfisher/figma_mcp.git 
cd figma_mcp
pushd plugin && npm run build && popd

In Figma, right-click and Plugins->Development->Import plugin from Manifest, and select the manifest.json file at figma_mcp/plugin/dist.

The plugin won't connect to the MCP server immediately - this will happen automatically when your MCP client (e.g. Claude Desktop) tries to connect to the MCP server.

MCP server

uv from https://github.com/astral-sh/uv

pushd server && uv pip install --requirement pyproject.toml && popd

If you are using Claude Desktop, add the following to your /Users/{username}/Library/Application Support/Claude/claude_desktop_config.json file:

    "figma":{
        "command": "/path/to/figma_mcp/server/.venv/bin/python", 
        "args":["/path/to/figma_mcp/server/figma.py"],
        "enabled": true
    }

Implementation

This uses websockets to create a connection between the MCP server and the Figma plugin.

figma_mcp FAQ

How do I install the figma_mcp client?

Clone the repository, build the plugin with npm, and import it into Figma via Plugins->Development->Import plugin from Manifest.

What prerequisites are needed to run figma_mcp?

You need Node.js version 20.18.1 or higher and a compatible MCP server to connect with the Figma plugin.

Is figma_mcp an official Figma plugin?

No, figma_mcp is an unofficial MCP client that interfaces with Figma's plugin API.

What functionality does figma_mcp currently support?

It supports object selection, changing fill/stroke colors, creating basic shapes, and exporting nodes to PNG.

Can I contribute to figma_mcp development?

Yes, the project is open for forks and pull requests to improve features and reliability.

How does figma_mcp connect to the MCP server?

The plugin connects automatically when an MCP client like Claude Desktop attempts to connect to the MCP server.

Is figma_mcp reliable for production use?

Currently, it is an early version with limited robustness and may not be reliable for critical workflows.

Which LLM providers can I use with figma_mcp?

figma_mcp is provider-agnostic and can work with OpenAI, Claude, Gemini, and other MCP-compatible LLMs.