MCP Figma

🚀 mcp-figma Documentation

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

🚀 Quick Start

This MCP server is crafted for seamless integration with the Figma API and is designed to collaborate with Claude and other MCP-compatible AI assistants.

✨ Features

This MCP server offers access to the following Figma API features:

• File operations (get file, get nodes, get images)
• Comment management
• Team/project management
• Component and style access
• Persistent API key storage

📦 Installation

Install using NPM

# Global installation
npm install -g mcp-figma

# Or local installation in your project
npm install mcp-figma

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

💻 Usage Examples

Using with Claude

1. Add mcp-figma to your Claude configuration:

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

2. When using Claude, you need to set your Figma API key for the first time:

Please use mcp-figma to set my Figma API key: figd_xxxxxxxxxxxxxxxxxxxxxxx

Your key will be stored in ~/.mcp-figma/config.json and automatically loaded in subsequent sessions. 3. Check if the API key is configured:

Please use mcp-figma to check the status of my API key

4. Then use any of the provided Figma API features:

Please use mcp-figma to get the file with key abc123

Available Tools

The server provides the following tools:

• set_api_key: Set your personal access token for the Figma API (saved to the configuration)
• check_api_key: Check if the API key is configured
• get_file: Get a Figma file by key
• get_file_nodes: Get specific nodes from a Figma file
• get_image: Get an image of a node in a Figma file
• get_image_fills: Get the URLs of images used in a Figma file
• get_comments: Get comments on a file
• post_comment: Post a comment on a file
• delete_comment: Delete a comment from a file
• get_team_projects: Get a team's projects
• get_project_files: Get a project's files
• get_team_components: Get a team's components
• get_file_components: Get components from a file
• get_component: Get a component by key
• get_team_component_sets: Get a team's component sets
• get_team_styles: Get a team's styles
• get_file_styles: Get styles from a file
• get_style: Get a style by key

For detailed usage examples, please refer to USAGE.md.

📄 License

MIT