Figma Mcp Server

Integrate with Figma's API to manage files, comments, and projects. Retrieve file information, manage comments, and automate tasks related to design workflows.

Author

Figma Mcp Server logo

deepsuthar496

No License

Quick Info

GitHub GitHub Stars 0
NPM Weekly Downloads 2366
Tools 1
Last Updated 4/4/2025

Tags

tools workflows figma developer tools tools integrations figma api

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