Skip to main content
0
C

Cursor Talk To Figma Mcp

TalkToFigma: MCP integration between AI Agent (Cursor, Claude Code) and Figma, allowing Agentic AI t

by grab

Rating

0.0

Votes

0

score

Downloads

0

total

Price

Free

No login needed

Works With

Claude CodeCursorWindsurfVS CodeDeveloper tool

About

Talk to Figma MCP

This project implements a Model Context Protocol (MCP) integration between AI agent (Cursor, Claude Code) and Figma, allowing AI agent to communicate with Figma for reading designs and modifying them programmatically.

https://github.com/user-attachments/assets/129a14d2-ed73-470f-9a4c-2240b2a4885c

Project Structure

  • src/talk_to_figma_mcp/ - TypeScript MCP server for Figma integration
  • src/cursor_mcp_plugin/ - Figma plugin for communicating with Cursor
  • src/socket.ts - WebSocket server that facilitates communication between the MCP server and Figma plugin

How to use

  1. 1.Install Bun if you haven't already:
bash
curl -fsSL https://bun.sh/install | bash
  1. 1.Run setup, this will also install MCP in your Cursor's active project
bash
bun setup
  1. 1.Start the Websocket server
bash
bun socket
  1. 1.NEW Install Figma plugin from Figma community page or install locally

Quick Video Tutorial

Video Link

Design Automation Example

Bulk text content replacement

Thanks to @dusskapark for contributing the bulk text replacement feature. Here is the demo video.

Instance Override Propagation Another contribution from @dusskapark Propagate component instance overrides from a source instance to multiple target instances with a single command. This feature dramatically reduces repetitive design work when working with component instances that need similar customizations. Check out our demo video.

Manual Setup and Installation

MCP Server: Integration with Cursor

Add the server to your Cursor MCP configuration in ~/.cursor/mcp.json:

json
{
  "mcpServers": {
    "TalkToFigma": {
      "command": "bunx",
      "args": ["cursor-talk-to-figma-mcp@latest"]
    }
  }
}

WebSocket Server

Start the WebSocket server:

bash
bun socket

Figma Plugin

  1. 1.In Figma, go to Plugins > Development > New Plugin
  2. 2.Choose "Link existing plugin"
  3. 3.Select the src/cursor_mcp_plugin/manifest.json file
  4. 4.The plugin should now be available in your Figma development plugins

Windows + WSL Guide

  1. 1.Install bun via powershell
bash
powershell -c "irm bun.sh/install.ps1|iex"
  1. 1.Uncomment the hostname 0.0.0.0 in src/socket.ts
typescript
// uncomment this to allow connections in windows wsl
hostname: "0.0.0.0",
  1. 1.Start the websocket
bash
bun socket

Usage

Don't lose this

Three weeks from now, you'll want Cursor Talk To Figma Mcp again. Will you remember where to find it?

Save it to your library and the next time you need Cursor Talk To Figma Mcp, it’s one tap away — from any AI app you use. Group it into a bench with the rest of the team for that kind of task and you can pull the whole stack at once.

⚡ Pro tip for geeks: add a-gnt 🤵🏻‍♂️ as a custom connector in Claude or a custom GPT in ChatGPT — one click and your library is right there in the chat. Or, if you’re in an editor, install the a-gnt MCP server and say “use my [bench name]” in Claude Code, Cursor, VS Code, or Windsurf.

🤵🏻‍♂️

a-gnt's Take

Our honest review

This plugs directly into your AI and gives it new abilities it didn't have before. TalkToFigma: MCP integration between AI Agent (Cursor, Claude Code) and Figma, allowing Agentic AI t. Once connected, just ask your AI to use it. It's completely free and works across most major AI apps. This one just landed in the catalog — worth trying while it's fresh.

Tips for getting started

1

Tap "Get" above, pick your AI app, and follow the steps. Most installs take under 30 seconds.

What's New

Version 1.0.06 days ago

Imported from GitHub

Ratings & Reviews

0.0

out of 5

0 ratings

No reviews yet. Be the first to share your experience.