by gaganmanku96
Enables Claude Desktop App to control Figma via MCP and WebSocket, offering a set of tools for document inspection, shape creation, styling, and component management.
A bridge that connects Claude Desktop App with the Figma desktop application using MCP and WebSocket communication. The integration runs a background WebSocket server and MCP server, exposing Figma operations as Claude tools.
git clone https://github.com/gaganmanku96/talk-with-figma-claude.git
cd talk-with-figma-claude
npm install
chmod +x run-figma-claude.sh
./bin/claude-figma-connect.shbin\claude-figma-connect.bat
This launches the WebSocket server, MCP server, and the Claude bridge.{
"mcpServers": {
"TalkToFigma": {
"command": "node",
"args": ["~/talk_to_figma_claude/src/mcp-server/mcp-server.js"],
"env": {}
}
}
}
join_channel to establish a connection.create_rectangle, get_document_info, enhanced_create_component_instance, etc.http://localhost:3650 while the server runs.Q: Do I need the Figma web version? A: No, the desktop version of Figma is required.
Q: Which Node.js version is supported? A: Node.js 14 or newer.
Q: Where are the logs stored?
A: In the logs directory, with separate timestamped files for each component.
Q: How can I check if the connection is healthy?
A: Use the health_check or connection_status tools from Claude.
Q: What if the integration stops responding? A: Review the log files, ensure the Figma plugin is installed, and restart the scripts.
Q: Can I run the server on a remote machine? A: Yes, as long as the WebSocket endpoint is reachable from the Claude Desktop App and the Figma desktop client is running on the same machine or network.
This project enables Claude Desktop App to control Figma through the MCP (Model Context Protocol) and WebSocket communication. It extends the original cursor-talk-to-figma-mcp to work with Claude Desktop App via stdio.
YT Video: https://www.youtube.com/watch?v=-LA_Ew7GhC4
https://github.com/user-attachments/assets/68dcc372-3605-477f-ab43-8fe076eed99c
Clone this repository:
git clone https://github.com/gaganmanku96/talk-with-figma-claude.git
cd talk-with-figma-claude
Install dependencies:
npm install
Make the startup scripts executable (Linux/macOS):
chmod +x run-figma-claude.sh
./bin/claude-figma-connect.sh
bin\claude-figma-connect.bat
This will start all necessary components:
join_channel to establish a connectioncreate_rectangle, get_document_info, etc.talk-with-figma-claude > src > figma_plugin > manifest.json
You'll have to add following in Claude MCP Config
{
"mcpServers": {
"TalkToFigma": {
"command": "node",
"args": [
"~/talk_to_figma_claude/src/mcp-server/mcp-server.js"
],
"env": {}
}
}
}
talk_to_figma_claude\src\mcp-server\mcp-server.js
get_document_info, get_selection, etc.)create_rectangle, create_frame, create_text, etc.)set_fill_color, set_corner_radius, etc.)create_component, update_instance_properties, etc.)enhanced_create_component_instance: Better component instance creationenhanced_set_fill_color: Improved color handlingcreate_multiple_instances: Batch creation of instancesLogs are stored in the logs directory with timestamped files for each component.
A server monitoring dashboard is available at http://localhost:3650 when the server is running.
If you encounter issues:
logs directoryhealth_check or connection_status tools from ClaudeMIT License - See LICENSE file for details.
Please log in to share your review and rating for this MCP.
{
"mcpServers": {
"TalkToFigma": {
"command": "node",
"args": [
"~/talk_to_figma_claude/src/mcp-server/mcp-server.js"
],
"env": {}
}
}
}claude mcp add TalkToFigma node ~/talk_to_figma_claude/src/mcp-server/mcp-server.jsExplore related MCPs that share similar capabilities and solve comparable challenges
by activepieces
A self‑hosted, open‑source platform that provides a no‑code builder for creating, versioning, and running AI‑driven automation workflows. Pieces are TypeScript‑based plugins that become MCP servers, allowing direct consumption by large language models.
by Skyvern-AI
Automates browser‑based workflows by leveraging large language models and computer‑vision techniques, turning natural‑language prompts into fully functional web interactions without writing custom scripts.
by ahujasid
Enables Claude AI to control Blender for prompt‑assisted 3D modeling, scene creation, and manipulation via a socket‑based Model Context Protocol server.
by PipedreamHQ
Connect APIs quickly with a free, hosted integration platform that enables event‑driven automations across 1,000+ services and supports custom code in Node.js, Python, Go, or Bash.
by elie222
Organizes email inbox, drafts replies in the user's tone, tracks follow‑ups, and provides analytics to achieve inbox zero quickly.
by grab
Enables Cursor AI to read and programmatically modify Figma designs through a Model Context Protocol integration.
by CursorTouch
Enables AI agents to control the Windows operating system, performing file navigation, application launching, UI interaction, QA testing, and other automation tasks through a lightweight server.
by ahujasid
Enables Claude AI to control Ableton Live in real time, allowing AI‑driven creation, editing, and playback of tracks, clips, instruments, and effects through a socket‑based server.
by leonardsellem
Provides tools and resources to enable AI assistants to manage and execute n8n workflows via natural language commands.