Provides integration with Figma's API, enabling file operations (information retrieval, version history, components), comment management (listing, adding, deleting), project and team features (listing projects, getting files, accessing published styles), and webhook management.
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@Figma MCP Serverget comments from file ABC123XYZ"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Figma MCP Server
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
Related MCP server: Figma MCP Server
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 claudeManual Installation
Clone the repository
Install dependencies:
npm installBuild the server:
npm run buildConfiguration
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
Fork the repository
Create your feature branch
Commit your changes
Push to the branch
Create a new Pull Request