Figma i18n

Extracts visible text from Figma files and outputs nested JSON for translation workflows.

javascript

0

GitHub Stars

javascript

Language

5 months ago

First Indexed

2 months ago

Catalog Refreshed

Documentation & install

Readme and setup notes from the catalogue, plus a client-ready config you can copy for your MCP host.

Installation

Add the following to your MCP client configuration file.

Configuration

View docs

{
  "mcpServers": {
    "doublea411-figma-i18n-mcp": {
      "command": "node",
      "args": [
        "/absolute/path/to/i18n-figma-mcp/src/index.js"
      ],
      "env": {
        "FIGMA_TOKEN": "YOUR_FIGMA_TOKEN_HERE"
      }
    }
  }
}

You have a Model Context Protocol (MCP) server that automatically extracts visible text from Figma designs for internationalization (i18n). It organizes the extracted text into a structured JSON format, grouped by frames and components, and is ideal for translating UI strings consistently across your product.

How to use

Use this MCP server with an MCP client to extract i18n-ready text from your Figma files. You can pull all visible text from an entire document or target a specific frame. The tool returns a nested JSON structure that maps frames and components to their corresponding text keys, making it straightforward to feed translation workflows and localization pipelines.

How to install

# Prerequisites
- Node.js v18 or higher
- Figma Access Token
- Claude Desktop or any MCP-compatible client

# Install dependencies and set up the MCP server (example)
# 1) Install dependencies
npm install

# 2) Start the MCP server (local stdio configuration will specify the command and args)

Configuration and usage notes

This MCP server runs as a local stdio server that you invoke from your MCP client. The config shown here demonstrates how to launch the server from a client like Claude Desktop, including the required environment variable for the Figma access token.

Key environment variable you must provide:

FIGMA_TOKEN: Your Figma Personal Access Token used to read files.

Troubleshooting

If you encounter errors, verify that the Figma token is correct and has read access to the target file. Ensure the MCP command and working directory are correctly specified in your client configuration, and restart the client after applying changes.

Development

To run and test locally, install dependencies and start the server as described in the install steps. The server communicates via stdio and accepts JSON-RPC messages following the MCP protocol.

Available tools

extract_figma_i18n

Command to extract i18n text from a Figma file or frame and output a nested JSON structure grouped by frames/components.