mcp-figma

mcp-figma

A Model Context Protocol server that provides access to Figma API functionality, allowing AI assistants like Claude to interact with Figma files, comments, components, and team resources.

smithery-ai

Art & Culture
Developer Tools
Visit Server

Tools

get_comments

Get comments on a Figma file

set_api_key

Set your Figma API personal access token (will be saved to ~/.mcp-figma/config.json)

check_api_key

Check if a Figma API key is already configured

get_file

Get a Figma file by key

get_file_nodes

Get specific nodes from a Figma file

get_image

Get images for nodes in a Figma file

get_image_fills

Get URLs for images used in a Figma file

post_comment

Post a comment on a Figma file

delete_comment

Delete a comment from a Figma file

get_team_projects

Get projects for a team

get_project_files

Get files for a project

get_team_components

Get components for a team

get_file_components

Get components from a file

get_component

Get a component by key

get_team_component_sets

Get component sets for a team

get_team_styles

Get styles for a team

get_file_styles

Get styles from a file

get_style

Get a style by key

README

mcp-figma

A Model Context Protocol (MCP) server for Figma API integration, designed to be used with Claude and other MCP-compatible AI assistants.

npm version

Features

This MCP server provides access to Figma API functionality:

  • File operations (get file, get nodes, get images)
  • Comments management
  • Team/project management
  • Components and styles access
  • Persistent API key storage

Installation

NPM Installation

# Install globally
npm install -g mcp-figma

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

# Update to latest version
npm update -g mcp-figma

Usage with Claude

  1. Add mcp-figma to your Claude configuration:
"mcp-figma": {
  "command": "npx",
  "args": [
    "-y",
    "mcp-figma"
  ]
}
  1. When using Claude, the first time you'll need to set your Figma API key:
Please use mcp-figma to set my Figma API key: figd_xxxxxxxxxxxxxxxxxxxxxxx

Your API key will be stored in ~/.mcp-figma/config.json and will be automatically loaded in future sessions.

  1. You can verify your API key is configured:
Please use mcp-figma to check my API key status
  1. Then use any of the available Figma API functions:
Please use mcp-figma to get the file with key abc123

Available Tools

The server provides the following 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
  • get_file: Get a Figma file by key
  • get_file_nodes: Get specific nodes from a Figma file
  • get_image: Get images for nodes in a Figma file
  • get_image_fills: Get URLs for images used in a Figma file
  • get_comments: Get comments on a Figma file
  • post_comment: Post a comment on a Figma file
  • delete_comment: Delete a comment from a Figma file
  • get_team_projects: Get projects for a team
  • get_project_files: Get files for a project
  • get_team_components: Get components for a team
  • get_file_components: Get components from a file
  • get_component: Get a component by key
  • get_team_component_sets: Get component sets for a team
  • get_team_styles: Get styles for a team
  • get_file_styles: Get styles from a file
  • get_style: Get a style by key

For detailed usage examples, see USAGE.md.

License

MIT

Recommended Servers

playwright-mcp

playwright-mcp

A Model Context Protocol server that enables LLMs to interact with web pages through structured accessibility snapshots without requiring vision models or screenshots.

Official
Featured
TypeScript
Magic Component Platform (MCP)

Magic Component Platform (MCP)

An AI-powered tool that generates modern UI components from natural language descriptions, integrating with popular IDEs to streamline UI development workflow.

Official
Featured
Local
TypeScript
MCP Package Docs Server

MCP Package Docs Server

Facilitates LLMs to efficiently access and fetch structured documentation for packages in Go, Python, and NPM, enhancing software development with multi-language support and performance optimization.

Featured
Local
TypeScript
Claude Code MCP

Claude Code MCP

An implementation of Claude Code as a Model Context Protocol server that enables using Claude's software engineering capabilities (code generation, editing, reviewing, and file operations) through the standardized MCP interface.

Featured
Local
JavaScript
@kazuph/mcp-taskmanager

@kazuph/mcp-taskmanager

Model Context Protocol server for Task Management. This allows Claude Desktop (or any MCP client) to manage and execute tasks in a queue-based system.

Featured
Local
JavaScript
Linear MCP Server

Linear MCP Server

Enables interaction with Linear's API for managing issues, teams, and projects programmatically through the Model Context Protocol.

Featured
JavaScript
mermaid-mcp-server

mermaid-mcp-server

A Model Context Protocol (MCP) server that converts Mermaid diagrams to PNG images.

Featured
JavaScript
Jira-Context-MCP

Jira-Context-MCP

MCP server to provide Jira Tickets information to AI coding agents like Cursor

Featured
TypeScript
Linear MCP Server

Linear MCP Server

A Model Context Protocol server that integrates with Linear's issue tracking system, allowing LLMs to create, update, search, and comment on Linear issues through natural language interactions.

Featured
JavaScript
Sequential Thinking MCP Server

Sequential Thinking MCP Server

This server facilitates structured problem-solving by breaking down complex issues into sequential steps, supporting revisions, and enabling multiple solution paths through full MCP integration.

Featured
Python