figma-mcp-go

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

figma-mcp-go

Skill by ara.so — MCP Skills collection

An open-source MCP server that provides full read/write access to Figma files through a plugin bridge, bypassing REST API rate limits. Built in Go, it enables AI tools like Claude, Cursor, and GitHub Copilot to automate design workflows, create components, modify styles, manage variables, and export designs to code.

由ara.so开发的Skill——MCP Skills合集

这是一个开源的MCP服务器，通过插件桥接实现对Figma文件的完整读写权限，绕过REST API的速率限制。基于Go语言构建，可让Claude、Cursor、GitHub Copilot等AI工具自动化设计工作流，创建组件、修改样式、管理变量，并将设计导出为代码。

What It Does

功能特性

No API Token Required: Works through a Figma plugin, avoiding REST API limits (6 calls/month on free plans)
73 Tools: Complete CRUD operations for frames, components, text, styles, variables, prototypes, and more
Bidirectional: Read design context and write changes back to live Figma files
Export: Screenshot nodes, generate PDFs, export design tokens as JSON/CSS
Built-in Strategies: Includes MCP prompts for design best practices

无需API令牌：通过Figma插件运行，避开REST API限制（免费计划每月仅6次调用）
73种工具：支持框架、组件、文本、样式、变量、原型等的完整CRUD操作
双向交互：读取设计上下文并将修改实时写回Figma文件
导出功能：节点截图、生成PDF、将设计令牌导出为JSON/CSS格式
内置策略：包含符合设计最佳实践的MCP提示词

Installation

安装步骤

1. Configure MCP Server

1. 配置MCP服务器

Claude Code CLI:

bash

claude mcp add -s project figma-mcp-go -- npx -y @vkhanhqui/figma-mcp-go@latest

Codex CLI:

bash

codex mcp add figma-mcp-go -- npx -y @vkhanhqui/figma-mcp-go@latest

Cursor / VS Code / GitHub Copilot (
.vscode/mcp.json
):

json

{
  "servers": {
    "figma-mcp-go": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "@vkhanhqui/figma-mcp-go"]
    }
  }
}

Claude Desktop (
.mcp.json
):

json

{
  "mcpServers": {
    "figma-mcp-go": {
      "command": "npx",
      "args": ["-y", "@vkhanhqui/figma-mcp-go"]
    }
  }
}

Claude Code CLI：

bash

claude mcp add -s project figma-mcp-go -- npx -y @vkhanhqui/figma-mcp-go@latest

Codex CLI：

bash

codex mcp add figma-mcp-go -- npx -y @vkhanhqui/figma-mcp-go@latest

Cursor / VS Code / GitHub Copilot（
.vscode/mcp.json
）：

json

{
  "servers": {
    "figma-mcp-go": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "@vkhanhqui/figma-mcp-go"]
    }
  }
}

Claude Desktop（
.mcp.json
）：

json

{
  "mcpServers": {
    "figma-mcp-go": {
      "command": "npx",
      "args": ["-y", "@vkhanhqui/figma-mcp-go"]
    }
  }
}

2. Install Figma Plugin

2. 安装Figma插件

Download plugin.zip
Open Figma Desktop → Plugins → Development → Import plugin from manifest
Select
```
manifest.json
```
from the extracted ZIP
Run the plugin inside any Figma file (it must stay open while using MCP tools)

下载plugin.zip
打开Figma桌面端 → 插件 → 开发 → 从清单导入插件
从解压后的ZIP文件中选择
```
manifest.json
```
在任意Figma文件中运行插件（使用MCP工具期间需保持插件处于打开状态）

Core Workflows

核心工作流

Reading Design Context

读取设计上下文

Get current page structure:

typescript

// Use get_design_context for depth-limited tree with detail control
const context = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "get_design_context",
  arguments: {
    rootNodeId: "0:1",  // page ID or specific frame
    maxDepth: 3,
    detail: "compact"   // minimal | compact | full
  }
});

Get metadata and page list:

typescript

const metadata = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "get_metadata",
  arguments: {}
});

const pages = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "get_pages",
  arguments: {}
});

Search for nodes:

typescript

const results = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "search_nodes",
  arguments: {
    rootNodeId: "0:1",
    nameSubstring: "Button",
    types: ["COMPONENT", "INSTANCE"]
  }
});

获取当前页面结构：

typescript

// 使用get_design_context获取深度可控的树状结构
const context = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "get_design_context",
  arguments: {
    rootNodeId: "0:1",  // 页面ID或特定框架ID
    maxDepth: 3,
    detail: "compact"   // minimal | compact | full
  }
});

获取元数据和页面列表：

typescript

const metadata = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "get_metadata",
  arguments: {}
});

const pages = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "get_pages",
  arguments: {}
});

搜索节点：

typescript

const results = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "search_nodes",
  arguments: {
    rootNodeId: "0:1",
    nameSubstring: "Button",
    types: ["COMPONENT", "INSTANCE"]
  }
});

Creating Design Elements

创建设计元素

Create a frame with auto-layout:

typescript

const frame = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_frame",
  arguments: {
    name: "Hero Section",
    x: 0,
    y: 0,
    width: 1440,
    height: 600,
    fills: "#0066FF",
    layoutMode: "VERTICAL",
    primaryAxisAlignItems: "CENTER",
    counterAxisAlignItems: "CENTER",
    itemSpacing: 24,
    paddingTop: 48,
    paddingRight: 48,
    paddingBottom: 48,
    paddingLeft: 48
  }
});

Create text node:

typescript

const text = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_text",
  arguments: {
    characters: "Welcome to Our Platform",
    fontFamily: "Inter",
    fontStyle: "Bold",
    fontSize: 48,
    x: 100,
    y: 100,
    parentId: frame.id  // optional, parent frame
  }
});

Import image from base64:

typescript

const image = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "import_image",
  arguments: {
    base64Data: "iVBORw0KGgoAAAANSUhEUg...",  // without data:image prefix
    x: 0,
    y: 0,
    width: 800,
    height: 600,
    name: "Hero Image",
    parentId: frame.id
  }
});

创建带自动布局的框架：

typescript

const frame = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_frame",
  arguments: {
    name: "Hero Section",
    x: 0,
    y: 0,
    width: 1440,
    height: 600,
    fills: "#0066FF",
    layoutMode: "VERTICAL",
    primaryAxisAlignItems: "CENTER",
    counterAxisAlignItems: "CENTER",
    itemSpacing: 24,
    paddingTop: 48,
    paddingRight: 48,
    paddingBottom: 48,
    paddingLeft: 48
  }
});

创建文本节点：

typescript

const text = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_text",
  arguments: {
    characters: "Welcome to Our Platform",
    fontFamily: "Inter",
    fontStyle: "Bold",
    fontSize: 48,
    x: 100,
    y: 100,
    parentId: frame.id  // 可选，父框架ID
  }
});

从base64导入图片：

typescript

const image = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "import_image",
  arguments: {
    base64Data: "iVBORw0KGgoAAAANSUhEUg...",  // 无需data:image前缀
    x: 0,
    y: 0,
    width: 800,
    height: 600,
    name: "Hero Image",
    parentId: frame.id
  }
});

Modifying Existing Nodes

修改现有节点

Update text content:

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "set_text",
  arguments: {
    nodeId: "123:456",
    characters: "Updated heading text"
  }
});

Set fills and strokes:

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "set_fills",
  arguments: {
    nodeIds: ["123:456", "123:457"],
    color: "#FF5733"
  }
});

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "set_strokes",
  arguments: {
    nodeId: "123:456",
    color: "#000000",
    weight: 2
  }
});

Batch find and replace text:

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "find_replace_text",
  arguments: {
    rootNodeId: "0:1",  // search entire page
    findText: "Company Name",
    replaceText: "Acme Corp",
    useRegex: false,
    caseSensitive: false
  }
});

Resize and reposition:

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "resize_nodes",
  arguments: {
    nodeIds: ["123:456"],
    width: 1200,
    height: 800
  }
});

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "move_nodes",
  arguments: {
    nodeIds: ["123:456"],
    x: 200,
    y: 300
  }
});

更新文本内容：

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "set_text",
  arguments: {
    nodeId: "123:456",
    characters: "Updated heading text"
  }
});

设置填充和描边：

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "set_fills",
  arguments: {
    nodeIds: ["123:456", "123:457"],
    color: "#FF5733"
  }
});

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "set_strokes",
  arguments: {
    nodeId: "123:456",
    color: "#000000",
    weight: 2
  }
});

批量查找替换文本：

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "find_replace_text",
  arguments: {
    rootNodeId: "0:1",  // 搜索整个页面
    findText: "Company Name",
    replaceText: "Acme Corp",
    useRegex: false,
    caseSensitive: false
  }
});

调整大小和位置：

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "resize_nodes",
  arguments: {
    nodeIds: ["123:456"],
    width: 1200,
    height: 800
  }
});

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "move_nodes",
  arguments: {
    nodeIds: ["123:456"],
    x: 200,
    y: 300
  }
});

Working with Components

组件操作

Create component from frame:

typescript

const component = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_component",
  arguments: {
    nodeId: "123:456",  // must be a FRAME
    name: "Button/Primary"
  }
});

Swap component instance:

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "swap_component",
  arguments: {
    instanceId: "123:789",
    newComponentId: "456:123"
  }
});

Detach instance:

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "detach_instance",
  arguments: {
    nodeIds: ["123:789"]
  }
});

从框架创建组件：

typescript

const component = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_component",
  arguments: {
    nodeId: "123:456",  // 必须是FRAME类型
    name: "Button/Primary"
  }
});

替换组件实例：

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "swap_component",
  arguments: {
    instanceId: "123:789",
    newComponentId: "456:123"
  }
});

分离组件实例：

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "detach_instance",
  arguments: {
    nodeIds: ["123:789"]
  }
});

Styles and Variables

样式与变量

Create paint style:

typescript

const style = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_paint_style",
  arguments: {
    name: "Colors/Primary/500",
    color: "#0066FF"
  }
});

Create text style:

typescript

const textStyle = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_text_style",
  arguments: {
    name: "Heading/H1",
    fontFamily: "Inter",
    fontStyle: "Bold",
    fontSize: 48,
    lineHeight: 56,
    letterSpacing: -0.5
  }
});

Apply style to node:

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "apply_style_to_node",
  arguments: {
    nodeId: "123:456",
    styleId: style.id,
    styleType: "FILL"  // FILL | STROKE | TEXT | EFFECT | GRID
  }
});

Create variable collection:

typescript

const collection = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_variable_collection",
  arguments: {
    name: "Spacing",
    initialModeName: "Default"
  }
});

Create and bind variable:

typescript

const variable = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_variable",
  arguments: {
    collectionId: collection.id,
    name: "spacing-md",
    resolvedType: "FLOAT"
  }
});

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "set_variable_value",
  arguments: {
    variableId: variable.id,
    modeId: collection.defaultModeId,
    value: 16
  }
});

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "bind_variable_to_node",
  arguments: {
    nodeId: "123:456",
    variableId: variable.id,
    field: "itemSpacing"  // fillColor | strokeColor | width | height | opacity | rotation | visible | cornerRadius | itemSpacing | paddingLeft | etc.
  }
});

创建填充样式：

typescript

const style = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_paint_style",
  arguments: {
    name: "Colors/Primary/500",
    color: "#0066FF"
  }
});

创建文本样式：

typescript

const textStyle = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_text_style",
  arguments: {
    name: "Heading/H1",
    fontFamily: "Inter",
    fontStyle: "Bold",
    fontSize: 48,
    lineHeight: 56,
    letterSpacing: -0.5
  }
});

为节点应用样式：

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "apply_style_to_node",
  arguments: {
    nodeId: "123:456",
    styleId: style.id,
    styleType: "FILL"  // FILL | STROKE | TEXT | EFFECT | GRID
  }
});

创建变量集合：

typescript

const collection = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_variable_collection",
  arguments: {
    name: "Spacing",
    initialModeName: "Default"
  }
});

创建并绑定变量：

typescript

const variable = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_variable",
  arguments: {
    collectionId: collection.id,
    name: "spacing-md",
    resolvedType: "FLOAT"
  }
});

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "set_variable_value",
  arguments: {
    variableId: variable.id,
    modeId: collection.defaultModeId,
    value: 16
  }
});

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "bind_variable_to_node",
  arguments: {
    nodeId: "123:456",
    variableId: variable.id,
    field: "itemSpacing"  // fillColor | strokeColor | width | height | opacity | rotation | visible | cornerRadius | itemSpacing | paddingLeft | 等
  }
});

Prototyping

原型设计

Set prototype reactions:

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "set_reactions",
  arguments: {
    nodeId: "123:456",
    reactions: [
      {
        trigger: { type: "ON_CLICK" },
        actions: [
          {
            type: "NODE",
            destinationId: "123:789",
            navigation: "NAVIGATE",
            transition: {
              type: "DISSOLVE",
              duration: 0.3,
              easing: { type: "EASE_OUT" }
            }
          }
        ]
      }
    ],
    mode: "replace"  // replace | append
  }
});

Get reactions:

typescript

const reactions = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "get_reactions",
  arguments: {
    nodeId: "123:456"
  }
});

设置原型交互：

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "set_reactions",
  arguments: {
    nodeId: "123:456",
    reactions: [
      {
        trigger: { type: "ON_CLICK" },
        actions: [
          {
            type: "NODE",
            destinationId: "123:789",
            navigation: "NAVIGATE",
            transition: {
              type: "DISSOLVE",
              duration: 0.3,
              easing: { type: "EASE_OUT" }
            }
          }
        ]
      }
    ],
    mode: "replace"  // replace | append
  }
});

获取交互设置：

typescript

const reactions = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "get_reactions",
  arguments: {
    nodeId: "123:456"
  }
});

Exporting

导出功能

Take screenshot:

typescript

const screenshot = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "get_screenshot",
  arguments: {
    nodeId: "123:456",
    format: "PNG",
    scale: 2
  }
});
// Returns base64-encoded image

Save screenshots to disk:

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "save_screenshots",
  arguments: {
    nodeIds: ["123:456", "123:789"],
    outputDir: "/path/to/exports",
    format: "PNG",
    scale: 2,
    filenameTemplate: "{nodeName}_{nodeId}"
  }
});

Export frames to PDF:

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "export_frames_to_pdf",
  arguments: {
    frameIds: ["123:1", "123:2", "123:3"],
    outputPath: "/path/to/output.pdf",
    scale: 2
  }
});

Export design tokens:

typescript

const tokens = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "export_tokens",
  arguments: {
    format: "json"  // json | css
  }
});
// Returns design tokens (variables + paint styles)

生成截图：

typescript

const screenshot = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "get_screenshot",
  arguments: {
    nodeId: "123:456",
    format: "PNG",
    scale: 2
  }
});
// 返回base64编码的图片

将截图保存到磁盘：

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "save_screenshots",
  arguments: {
    nodeIds: ["123:456", "123:789"],
    outputDir: "/path/to/exports",
    format: "PNG",
    scale: 2,
    filenameTemplate: "{nodeName}_{nodeId}"
  }
});

将框架导出为PDF：

typescript

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "export_frames_to_pdf",
  arguments: {
    frameIds: ["123:1", "123:2", "123:3"],
    outputPath: "/path/to/output.pdf",
    scale: 2
  }
});

导出设计令牌：

typescript

const tokens = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "export_tokens",
  arguments: {
    format: "json"  // json | css
  }
});
// 返回设计令牌（变量+填充样式）

Common Patterns

常见模式

Design System Setup

设计系统搭建

typescript

// 1. Create color variables
const colorCollection = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_variable_collection",
  arguments: { name: "Colors", initialModeName: "Light" }
});

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "add_variable_mode",
  arguments: { collectionId: colorCollection.id, modeName: "Dark" }
});

const primaryVar = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_variable",
  arguments: {
    collectionId: colorCollection.id,
    name: "primary",
    resolvedType: "COLOR"
  }
});

// Set values for both modes
await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "set_variable_value",
  arguments: {
    variableId: primaryVar.id,
    modeId: colorCollection.modes[0].id,  // Light
    value: "#0066FF"
  }
});

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "set_variable_value",
  arguments: {
    variableId: primaryVar.id,
    modeId: colorCollection.modes[1].id,  // Dark
    value: "#66B3FF"
  }
});

// 2. Create component with bound variable
const buttonFrame = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_frame",
  arguments: {
    name: "Button",
    width: 200,
    height: 48,
    layoutMode: "HORIZONTAL",
    primaryAxisAlignItems: "CENTER",
    counterAxisAlignItems: "CENTER"
  }
});

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "bind_variable_to_node",
  arguments: {
    nodeId: buttonFrame.id,
    variableId: primaryVar.id,
    field: "fillColor"
  }
});

const component = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_component",
  arguments: { nodeId: buttonFrame.id, name: "Button/Primary" }
});

typescript

// 1. 创建颜色变量
const colorCollection = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_variable_collection",
  arguments: { name: "Colors", initialModeName: "Light" }
});

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "add_variable_mode",
  arguments: { collectionId: colorCollection.id, modeName: "Dark" }
});

const primaryVar = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_variable",
  arguments: {
    collectionId: colorCollection.id,
    name: "primary",
    resolvedType: "COLOR"
  }
});

// 为两种模式设置值
await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "set_variable_value",
  arguments: {
    variableId: primaryVar.id,
    modeId: colorCollection.modes[0].id,  // Light模式
    value: "#0066FF"
  }
});

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "set_variable_value",
  arguments: {
    variableId: primaryVar.id,
    modeId: colorCollection.modes[1].id,  // Dark模式
    value: "#66B3FF"
  }
});

// 2. 创建绑定变量的组件
const buttonFrame = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_frame",
  arguments: {
    name: "Button",
    width: 200,
    height: 48,
    layoutMode: "HORIZONTAL",
    primaryAxisAlignItems: "CENTER",
    counterAxisAlignItems: "CENTER"
  }
});

await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "bind_variable_to_node",
  arguments: {
    nodeId: buttonFrame.id,
    variableId: primaryVar.id,
    field: "fillColor"
  }
});

const component = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_component",
  arguments: { nodeId: buttonFrame.id, name: "Button/Primary" }
});

Bulk Content Updates

批量内容更新

typescript

// Find all text nodes in a page
const textNodes = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "scan_text_nodes",
  arguments: { rootNodeId: "0:1" }
});

// Update placeholder text
for (const node of textNodes) {
  if (node.characters.includes("Lorem ipsum")) {
    await use_mcp_tool({
      server_name: "figma-mcp-go",
      tool_name: "set_text",
      arguments: {
        nodeId: node.id,
        characters: node.characters.replace("Lorem ipsum", "Real content")
      }
    });
  }
}

// Or use find_replace_text for efficiency
await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "find_replace_text",
  arguments: {
    rootNodeId: "0:1",
    findText: "Lorem ipsum",
    replaceText: "Real content",
    useRegex: false
  }
});

typescript

// 查找页面中所有文本节点
const textNodes = await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "scan_text_nodes",
  arguments: { rootNodeId: "0:1" }
});

// 更新占位文本
for (const node of textNodes) {
  if (node.characters.includes("Lorem ipsum")) {
    await use_mcp_tool({
      server_name: "figma-mcp-go",
      tool_name: "set_text",
      arguments: {
        nodeId: node.id,
        characters: node.characters.replace("Lorem ipsum", "Real content")
      }
    });
  }
}

// 或使用find_replace_text提高效率
await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "find_replace_text",
  arguments: {
    rootNodeId: "0:1",
    findText: "Lorem ipsum",
    replaceText: "Real content",
    useRegex: false
  }
});

Component Organization

组件组织

typescript

// Group related frames
await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "group_nodes",
  arguments: {
    nodeIds: ["123:1", "123:2", "123:3"],
    groupName: "Button Variants"
  }
});

// Create sections for organization
await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_section",
  arguments: {
    name: "Components",
    x: 0,
    y: 0,
    width: 2000,
    height: 1000
  }
});

// Batch rename nodes
await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "batch_rename_nodes",
  arguments: {
    rootNodeId: "0:1",
    findPattern: "Frame",
    replaceText: "Card",
    useRegex: false
  }
});

typescript

// 分组相关框架
await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "group_nodes",
  arguments: {
    nodeIds: ["123:1", "123:2", "123:3"],
    groupName: "Button Variants"
  }
});

// 创建用于组织的分区
await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "create_section",
  arguments: {
    name: "Components",
    x: 0,
    y: 0,
    width: 2000,
    height: 1000
  }
});

// 批量重命名节点
await use_mcp_tool({
  server_name: "figma-mcp-go",
  tool_name: "batch_rename_nodes",
  arguments: {
    rootNodeId: "0:1",
    findPattern: "Frame",
    replaceText: "Card",
    useRegex: false
  }
});

Built-in MCP Prompts

内置MCP提示词

Access strategic guidance through MCP prompts:

```
read_design_strategy
```
: Best practices for reading Figma designs efficiently
```
design_strategy
```
: Best practices for creating and modifying designs
```
text_replacement_strategy
```
: Chunked approach for replacing text across large designs
```
annotation_conversion_strategy
```
: Convert manual annotations to native Figma annotations
```
swap_overrides_instances
```
: Transfer overrides between component instances
```
reaction_to_connector_strategy
```
: Map prototype reactions into flow diagrams

通过MCP提示词获取策略指导：

```
read_design_strategy
```
: 高效读取Figma设计的最佳实践
```
design_strategy
```
: 创建和修改设计的最佳实践
```
text_replacement_strategy
```
: 大型设计中替换文本的分块处理方法
```
annotation_conversion_strategy
```
: 将手动注释转换为原生Figma注释
```
swap_overrides_instances
```
: 在组件实例之间传递覆盖属性
```
reaction_to_connector_strategy
```
: 将原型交互映射为流程图

Troubleshooting

故障排除

Plugin not connecting:

Ensure Figma Desktop (not web) is running
Verify the plugin is active in the current file
Restart the plugin if idle for extended periods

Tools returning errors:

Check node IDs are valid using
```
get_document
```
or
```
search_nodes
```
Ensure node types match tool requirements (e.g.,
```
create_component
```
requires FRAME)
Verify parent nodes exist before reparenting

Font not loading:

Text creation automatically loads fonts, but custom fonts must be installed on your system
Use
```
get_fonts
```
to see available fonts in the current file

Export failures:

Ensure output directories exist and have write permissions
For
```
save_screenshots
```
and
```
export_frames_to_pdf
```
, paths are relative to server working directory

Performance with large files:

Use
```
maxDepth
```
in
```
get_design_context
```
to limit tree traversal
Use
```
detail: "minimal"
```
to reduce payload size
Query specific nodes with
```
get_node
```
or
```
search_nodes
```
instead of full page trees

插件无法连接：

确保运行的是Figma桌面端（而非网页版）
验证插件在当前文件中处于激活状态
若闲置时间过长，重启插件

工具返回错误：

使用
```
get_document
```
或
```
search_nodes
```
检查节点ID是否有效
确保节点类型符合工具要求（例如
```
create_component
```
需要FRAME类型节点）
重新父级化前验证父节点是否存在

字体无法加载：

创建文本时会自动加载字体，但自定义字体需提前安装在系统中
使用
```
get_fonts
```
查看当前文件中可用的字体

导出失败：

确保输出目录存在且有写入权限
```
save_screenshots
```
和
```
export_frames_to_pdf
```
的路径是相对于服务器工作目录的相对路径

大文件性能问题：

在
```
get_design_context
```
中使用
```
maxDepth
```
限制树遍历深度
使用
```
detail: "minimal"
```
减少负载大小
使用
```
get_node
```
或
```
search_nodes
```
查询特定节点，而非完整页面树