Figma MCP Server

remote-capable server

The server can be hosted and run remotely because it primarily relies on remote services or has no dependency on the local environment.

Integrations

  • Allows analyzing Figma file structures by extracting node hierarchies through the Figma API

Figma MCP サーバー

Figma ファイル構造を分析するための MCP (Model Context Protocol) サーバー。

特徴

  • Figmaファイルを分析してノード階層を抽出する
  • REST APIとMCPプロトコルの両方をサポート
  • 設定可能なノードツリーの深さ

前提条件

  • Node.js 16以上
  • npmまたはyarn
  • Figma APIキー

インストール

npmから

npm install -g figma-mcp-server

出典

git clone https://github.com/yourusername/mcp-figma.git cd mcp-figma npm install npm run build

構成

サンプル環境ファイルをコピーし、Figma API キーを追加します。

cp .env.example .env

次に、 .envファイルを編集し、Figma API キーを追加します。

FIGMA_API_KEY=your_figma_api_key_here

Figma アカウント設定から Figma API キーを取得できます: https://www.figma.com/developers/api#access-tokens

使用法

REST APIサーバーとして

サーバーを起動します。

npm start

これにより、ポート 3000 (または.envファイルで指定されたポート) で Express サーバーが起動します。

APIエンドポイント

  • GET /health - ヘルスチェックエンドポイント
  • GET /openapi.json - OpenAPI仕様
  • GET /mcp.json - MCP マニフェスト
  • POST /analyze - Figma ファイルを解析する

分析エンドポイントへのリクエストの例:

curl -X POST http://localhost:3000/analyze \ -H "Content-Type: application/json" \ -d '{"figmaUrl": "https://www.figma.com/file/FILE_ID/PROJECT_NAME?node-id=NODE_ID", "depth": 2}'

MCPサーバーとして

サーバーは、MCP プロトコルを介して LLM によって直接使用できます。

figma-mcp-server --cli

またはソースから実行する場合:

npm run start -- --cli

クライアントの例

シンプルなクライアントサンプルが含まれています。使い方は以下のとおりです。

node client-example.js https://www.figma.com/file/FILE_ID/PROJECT_NAME?node-id=NODE_ID 2

最後のパラメータはオプションの深度パラメータです。

発達

開発モードで実行

npm run dev

テスト

npm test

ドッカー

コンテナ化されたデプロイメント用に Dockerfile が提供されています。

docker build -t figma-mcp-server . docker run -p 3000:3000 --env-file .env figma-mcp-server

ライセンス

マサチューセッツ工科大学

You must be authenticated.

A
security – no known vulnerabilities
A
license - permissive license
A
quality - confirmed to work

REST API または MCP プロトコル経由でアクセス可能なノード階層を抽出することで、Figma ファイル構造の分析を容易にします。

  1. Features
    1. Prerequisites
      1. Installation
        1. From npm
        2. From source
      2. Configuration
        1. Usage
          1. As a REST API Server
          2. As an MCP Server
          3. Client Example
        2. Development
          1. Running in Development Mode
          2. Testing
        3. Docker
          1. License
            ID: 4xg15vn8hw