A
securityF
licenseA
qualityEnables seamless interaction with Figma via the Model Context Protocol, allowing LLM applications to access, manipulate, and track Figma files, components, and variables.
Last updated -
2
106
TypeScript
このモデル コンテキスト プロトコルサーバーを使用して、 Cursorやその他の AI 搭載コーディング ツールに Figma ファイルへのアクセスを許可します。
Cursor が Figma のデザイン データにアクセスできる場合、スクリーンショットを貼り付けるなどの他の方法よりも、デザインをワンショットで正確に作成する方がはるかに優れています。
デモ
Figmaのデザインデータを使ってCursorでUIを構築するデモをご覧ください
仕組み
- IDE のチャットを開きます (例: カーソルのエージェント モード)。
- Figma ファイル、フレーム、またはグループへのリンクを貼り付けます。
- Cursor に Figma ファイルで何かを実行するように指示します (例: デザインの実装)。
- カーソルは Figma から関連するメタデータを取得し、それを使用してコードを記述します。
このMCPサーバーは、Cursorとの使用に特化して設計されています。Figma APIからのコンテキストを返す前に、レスポンスを簡素化および変換し、最も関連性の高いレイアウトとスタイル情報のみがモデルに提供されます。
モデルに提供されるコンテキストの量を減らすと、AI の精度が向上し、応答の関連性が高まります。
はじめる
多くのコード エディターやその他の AI クライアントは、構成ファイルを使用して MCP サーバーを管理します。
figma-developer-mcpサーバーは、設定ファイルに以下を追加することで設定できます。
注意：このサーバーを使用するには、Figma アクセストークンを作成する必要があります。Figma API アクセストークンの作成方法については、こちらをご覧ください。
macOS / Linux
ウィンドウズ
または、 envフィールドにFIGMA_API_KEYとPORT設定することもできます。
Framelink Figma MCP サーバーの設定方法について詳しくは、 Framelink のドキュメントを参照してください。
スターの歴史
もっと詳しく知る
Framelink Figma MCPサーバーはシンプルながらも強力です。Framelink のサイトで詳細をご確認いただき、最大限に活用してください。
スポンサー
🥇 ゴールドスポンサー
🥈 シルバースポンサー
🥉ブロンズスポンサー
😻 少額の支援者
This server cannot be installed
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.
Cursor がモデル コンテキスト プロトコルを通じて Figma ファイルにアクセスできるようにすることで、コード生成のために設計データを正確に解釈して利用する能力が向上します。
Related Resources
Related MCP Servers
- AsecurityAlicenseAqualityAn MCP server integration that enables Cursor AI to communicate with Figma, allowing users to read designs and modify them programmatically through natural language commands.Last updated -192,5143,528JavaScriptMIT License
- -securityAlicense-qualityA Model Context Protocol server that integrates Figma design files with AI coding tools like Cursor, Windsurf, and Cline, allowing AI tools to access and understand Figma design data for generating more accurate code.Last updated -1246TypeScriptMIT License
- AsecurityFlicenseAqualityA tool that integrates Figma with Cursor through the Model Context Protocol, allowing users to retrieve, optimize, and convert design data from Figma files into structured CSS and design tokens.Last updated -1JavaScript