Cursor Talk to Figma

by grab

Community Design Tools 7k likes

This MCP integration bridges Cursor, Claude Code, or Codex to an open Figma file over WebSocket, letting an agent read node data and bulk-create or restyle designs.

Set up the bridge

bun setup && bun socket

Source: https://github.com/grab/cursor-talk-to-figma-mcp

About

Cursor Talk to Figma connects an AI coding agent to an open Figma document through a WebSocket relay and a companion Figma plugin: the agent joins a channel and can then query document structure, selection, and individual node info, or scan a whole page for nodes matching a type or containing specific text.

On the write side, it can create shapes, frames, sections, and text; restyle fills, strokes, and corner radii; manage auto-layout (padding, spacing, alignment); move, resize, clone, or delete nodes; and handle bulk text replacement, annotation creation, and propagating instance overrides from one component instance to many targets, the repetitive design edits that are painful to do by hand across dozens of frames.

Key features

  • Reads document structure, selections, and node details over a live WebSocket channel
  • Creates rectangles, frames, sections, and text nodes directly in the open Figma file
  • Batch text replacement and intelligent-chunking text scanning for large files
  • Auto-layout controls: layout mode, padding, axis alignment, item spacing, sizing
  • Propagates component instance overrides from a source instance to many targets at once
  • Exports any node as PNG, JPG, SVG, or PDF

Use cases

  • Applying a color/spacing system change across many frames instead of editing each by hand
  • Bulk-replacing copy across dozens of text nodes from a spreadsheet or CSV of translations
  • Propagating a design change made on one component instance to every other instance that uses it
  • Reading a Figma file's structure so an agent can generate matching frontend code

Available tools

get_document_info

Returns structural information about the currently open Figma document.

create_frame

Creates a new frame in the Figma file.

set_multiple_text_contents

Batch-updates the text content of multiple text nodes in one call.

set_instance_overrides

Propagates component instance overrides from a source instance to one or more target instances.

export_node_as_image

Exports a given node as a PNG, JPG, SVG, or PDF.

join_channel

Connects the agent to the WebSocket channel that bridges it to the running Figma plugin.

Frequently asked questions

Does this work with any Figma file, or does Figma need something installed?

You need the companion Figma plugin, installed from the Community page or run locally, alongside the WebSocket bridge. The agent talks to the plugin, not Figma's REST API directly, so it can react to a live, open document.

Which AI coding tools does it support?

Cursor, Claude Code, and Codex are called out explicitly, since it's a standard MCP server. Any MCP-compatible client that can run the bridge should work.