icon for mcp server

Figma Integration

STDIO

MCP server providing integration with Figma API for files, comments, and components management.

Figma MCP Server

smithery badge

A Model Context Protocol (MCP) server that provides integration with Figma's API, allowing you to interact with Figma files, comments, components, and more.

Features

  • File Operations

    • Get file information
    • Get file version history
    • Get file components
  • Comment Management

    • List comments in files
    • Add new comments
    • Delete comments
  • Project & Team Features

    • List team projects
    • Get project files
    • Get published styles
  • Webhook Management

    • Create webhooks
    • List existing webhooks
    • Delete webhooks

Installation

Installing via Smithery

To install Figma MCP Server for Claude Desktop automatically via Smithery:

npx -y @smithery/cli install @deepsuthar496/figma-mcp-server --client claude

Manual Installation

  1. Clone the repository
  2. Install dependencies:
npm install
  1. Build the server:
npm run build

Configuration

Configure the server in your MCP settings file with your Figma access token:

{ "mcpServers": { "figma": { "command": "node", "args": ["path/to/figma-server/build/index.js"], "env": { "FIGMA_ACCESS_TOKEN": "your-access-token-here" }, "disabled": false, "alwaysAllow": [] } } }

Available Tools

File Operations

get_file

Get information about a Figma file

{ "file_key": "string" }

get_file_versions

Get version history of a file

{ "file_key": "string" }

get_file_components

Get components in a file

{ "file_key": "string" }

Comment Management

get_file_comments

Get comments from a file

{ "file_key": "string" }

post_comment

Post a comment to a file

{ "file_key": "string", "message": "string" }

delete_comment

Delete a comment from a file

{ "file_key": "string", "comment_id": "string" }

Project & Team Operations

get_team_projects

Get projects for a team

{ "team_id": "string" }

get_project_files

Get files in a project

{ "project_id": "string" }

get_component_styles

Get published styles

{ "team_id": "string" }

Webhook Management

create_webhook

Create a webhook

{ "team_id": "string", "event_type": "string", "callback_url": "string" }

get_webhooks

List webhooks

{ "team_id": "string" }

delete_webhook

Delete a webhook

{ "webhook_id": "string" }

Usage Example

// Example using the MCP tool to get file information <use_mcp_tool> <server_name>figma</server_name> <tool_name>get_file</tool_name> <arguments> { "file_key": "your-file-key" } </arguments> </use_mcp_tool>

License

MIT

Contributing

  1. Fork the repository
  2. Create your feature branch
  3. Commit your changes
  4. Push to the branch
  5. Create a new Pull Request

Be the First to Experience MCP Now