home / mcp / mcp figma server

MCP Figma Server

Provides access to Figma files, images, comments, teams, components, and styles via MCP endpoints.

Installation

Add the following to your MCP client configuration file.

Configuration

{
  "mcpServers": {
    "smithery-ai-mcp-figma": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-figma"
      ]
    }
  }
}

You can integrate Figma data and actions into your AI workflows with this MCP server. It exposes Figma file access, images, comments, teams, components, and styles through simple MCP endpoints, so you can build powerful assistants that read and manipulate your Figma assets.

How to use

To use this MCP server with your MCP client, run the stdio server locally and point your client at the provided command. You will authenticate with a Figma API key once, and then you can perform actions such as getting files, fetching images, managing comments, and retrieving components and styles. Use the available tool endpoints to fetch data or post updates directly into Figma projects. Start by configuring the MCP client to invoke the mcp-figma tool, then set your API key when prompted. After that, call any supported function by name to perform the corresponding Figma operation.

How to install

Prerequisites you need on your machine before installing are Node.js and npm (Node.js 14+ is recommended). Ensure you have permission to install global npm packages if you choose the global installation path.

npm install -g mcp-figma

# Or install locally in a project
npm install mcp-figma

# Update to latest version (global)
npm update -g mcp-figma

Configuration and usage notes

Configure the MCP client to run the mcp-figma tool. You will provide your Figma API key during the first use and it will be stored for future sessions.

Stored API key location: your home directory under ~/.mcp-figma/config.json. The key is loaded automatically on subsequent runs.

Verify that your API key is configured before making requests.

Once configured, you can perform Figma operations such as getting a file, retrieving nodes, getting images, and managing comments and styles through the MCP client commands.

Security and best practices

Treat your Figma API key like a password. Do not expose it in public logs or shared configurations. Rotate your API key if you suspect it was exposed.

Limit the scope of what the API key can access if your key supports scoped permissions. Prefer a dedicated key for tooling rather than using a personal master key.

Troubleshooting

If you encounter authentication issues, re-check that the API key is correct and that it is stored in the expected path. Use the status check command to confirm the key is configured.

If a request fails due to a network error, verify your network connectivity and ensure the Figma API is reachable from your environment. Check any required firewall rules or proxies.

Available tools

set_api_key

Set your Figma API personal access token (saved to config)

check_api_key

Check if an API key is already configured in the MCP setup

get_file

Retrieve a Figma file by its key or ID

get_file_nodes

Fetch specific nodes from a Figma file by node IDs

get_image

Obtain images for specified nodes within a Figma file

get_image_fills

Get URLs for images used as fills in a Figma file

get_comments

Retrieve comments attached to a Figma file

post_comment

Post a new comment on a Figma file

delete_comment

Delete a comment from a Figma file

get_team_projects

List projects for a Figma team

get_project_files

List files within a Figma project

get_team_components

Retrieve components available to a team

get_file_components

Fetch components from a specific file

get_component

Get a component by its key

get_team_component_sets

Retrieve component sets for a team

get_team_styles

List styles for a team

get_file_styles

List styles defined in a file

get_style

Get a style by key