Figma

You run an MCP server that bridges AI assistants with Figma, enabling natural-language queries to explore file structures, extract assets, manage components, and coordinate design work in real time. This server keeps a persistent connection to handle interactive workflows and supports secure authentication, so your AI tools can reliably access Figma data without manual navigation.

How to use

Connect your MCP client to the Figma MCP Server to perform design data queries, asset exports, and collaboration actions. Use the real-time SSE transport for responsive interactions with Cursor IDE or Claude Desktop, or the HTTP transport for broader compatibility. Once connected, you can analyze Figma files, list components, export assets, retrieve and manage comments, and plan design modifications through structured prompts and tool calls.

How to install

Prerequisites you need to set up before running the MCP server:

• Node.js 20 or newer
• An Apify account
• A Figma account with API access
• A Figma Personal Access Token (PAT)

Step-by-step commands to get the MCP server running locally:

{
  "figmaAccessToken": "your-figma-personal-access-token",
  "port": 8080
}

Install dependencies and start the local server using the standard project workflow.

npm install
node src/main-local.js

Available tools

analyze_file

Analyze a Figma file to understand its structure and extract metadata such as frames, groups, and layers.

get_file_structure

Retrieve the hierarchical structure of a Figma file with a configurable depth.

extract_styles

Extract design tokens, styles, and design system information from a Figma file.

list_components

List all components and component sets present in a Figma file.

get_component_details

Fetch detailed information about a specific component, including variants and properties.

find_component_usage

Identify where a component is used across files and pages.

export_node

Export a single node as PNG, SVG, PDF, or JPG with configurable formats and scales.

export_multiple_nodes

Export multiple selected nodes in a batch operation.

export_file_pages

Export all pages from a Figma file for offline review or documentation.

get_comments

Retrieve comments from a Figma file for review or action.

create_comment

Create a new comment at a specific position or node within a Figma file.

resolve_comment

Mark a comment as resolved to close feedback threads.

delete_comment

Delete a comment from a Figma file.

update_node_properties

Update properties of a design node to plan or apply modifications.

get_node_for_modification

Get detailed information about a node to support modification planning.