Figma Context MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
作者による説明(英語の原文)
Generate and edit images with Labnana through a local MCP server with MCP Apps previews.
この3つを1つのスコアにまとめることはしません。意見、測定、人気はそれぞれ別のものだからです。
このサーバーのやさしい解説はまだ書いていません。以下はレジストリから読み取った事実です。
使っているAIアプリを選んで、設定をコピーしてください。
LABNANA_API_KEY, LABNANA_OUTPUT_DIR「秘密」と表示された値は、あなたのアカウントの鍵です。絶対に人に教えたり、チャットに貼り付けたりしないでください。
必要なもの
どのアプリを使っていますか?
上でアプリを選んでください。選んだアプリを覚えておくので、次からはボタンに「…にインストール」と表示されます。
Claude Desktop → Settings → Developer → Edit Config を開き、claude_desktop_config.json にこれを貼り付けます
{
"mcpServers": {
"labnana": {
"command": "npx",
"args": [
"-y",
"@exoticknight/labnana-mcp"
],
"env": {
"LABNANA_API_KEY": "your-value",
"LABNANA_OUTPUT_DIR": "your-value"
}
}
}
}ターミナルでこれを実行します
claude mcp add labnana --env LABNANA_API_KEY=your-value --env LABNANA_OUTPUT_DIR=your-value -- npx -y @exoticknight/labnana-mcp動かす前に、空欄の値を入力してください。
プロジェクトの .cursor/mcp.json、または ~/.cursor/mcp.json に貼り付けます
{
"mcpServers": {
"labnana": {
"command": "npx",
"args": [
"-y",
"@exoticknight/labnana-mcp"
],
"env": {
"LABNANA_API_KEY": "your-value",
"LABNANA_OUTPUT_DIR": "your-value"
}
}
}
}ブラウザがアプリを開いてよいか確認し、そのあとアプリが設定を表示して確認を求めます。キーの値は空欄のままなので、自分で入力してください。
プロジェクトの .vscode/mcp.json に貼り付けます
{
"servers": {
"labnana": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@exoticknight/labnana-mcp"
],
"env": {
"LABNANA_API_KEY": "your-value",
"LABNANA_OUTPUT_DIR": "your-value"
}
}
}
}ブラウザがアプリを開いてよいか確認し、そのあとアプリが設定を表示して確認を求めます。キーの値は空欄のままなので、自分で入力してください。
これはパソコンで動くサーバーですが、ChatGPTがつなげるのはインターネット上のサーバーだけです。ほかのアプリを選んでください。
選んだアプリは、この端末のCookieに保存されます。アカウントは不要です。
LABNANA_OUTPUT_DIR envこの設定は、作者のレジストリ登録情報から作成しています。READMEと違う場合は、READMEに従ってください。
パソコンで動くサーバーです。インストールすると、ツール一覧がAIアプリに表示されます。
誰でも見られる情報をチェックしており、コードは読んでいません。当てはまらない項目は数に入れていません。 · 2026年11月9日にチェック
レジストリ名は、リポジトリを所有するGitHubアカウント exoticknight で確認済みです
このリポジトリはまだGitHubから読み取っていません
このリポジトリはまだGitHubから読み取っていません
これはパソコンで動くため、インターネット上のエンドポイントはありません
パソコンで動き、代わりにローカルの設定を使います
パソコンで動くサーバーです。ツール一覧を読み取れるのは、インターネット上のエンドポイントがある場合だけです
レジストリでこのカテゴリにある有効なすべてのサーバーと比較しています。スターは、公開者がリポジトリの所有者である場合だけ数えます。
当てはまる基本チェック1項目のうち1項目に合格しました。コードは読んでいません。キーやトークンを追加する前に、サーバーがどんなアクセスを求めているかを確認し、必要な権限だけを持つキーを使ってください。
入力が必要なもの:LABNANA_API_KEY
あなたのパソコンで動きます。必要なときにAIアプリが起動し、データは作者のサーバーを通りません(サーバー自体がオンラインサービスを呼び出す場合を除きます)。
GitHubリポジトリの最終更新は–、最新バージョン(2.2.0)がレジストリに届いたのは18 日前です。
Claude Desktop、Claude Code、Cursor、VS CodeなどのMCP対応アプリで使えます。パソコンにNode.jsも必要です。
同じカテゴリには:Figma Context MCP, Claude Real Video, Figma MCP Server
同じカテゴリで、ほかの作者が作ったサーバー。スターの多い順。
カードの見方:↓ 週あたりのダウンロードi★ GitHubスターi3つの柱:レビュー · チェック · 利用状況i更新=最新バージョンをレジストリに公開した日i
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
Let any LLM watch a video locally — and search everything it has ever watched.
The Figma MCP server brings Figma design context directly into your AI workflow.
作者のリポジトリから書かれたとおりにコピーしたものです。PopNx MCPは内容を確認・推奨していません。HTML、画像、スクリプトは取り除いています。リンクはこのサイトの外へ移動します。
An MCP server for the Labnana OpenAPI. It enables Claude, Claude Code, and other MCP clients to generate and edit images with Labnana.
Current OpenAPI models (product names mapped to the model parameter):
| Product name | model | Provider | Resolutions | Best for |
|---|---|---|---|---|
| Nano Banana Pro | gemini-3-pro-image | 1K / 2K / 4K | In-image text, character consistency, high-fidelity output | |
| Nano Banana 2 | gemini-3.1-flash-image | 1K / 2K / 4K | Fast iteration and extreme aspect ratios | |
| GPT-Image-2 | gpt-image-2 | OpenAI | 1K / 2K / 4K | Spec-driven generation, layout control, illustration |
| GPT-Image-2.5 Flare | gpt-image-2.5-flare | OpenAI | 1K / 2K / 4K | Faster generation |
| GPT-Image-2.5 Sunburst | gpt-image-2.5-sunburst | OpenAI | 1K / 2K / 4K | Detail-dense images |
| Wan2.7 Image Pro | wan2.7-image-pro | Alibaba | 1K / 2K / 4K¹ | Photoreal and poster-style images |
| Wan2.7 Image | wan2.7-image | Alibaba | 1K / 2K | Lower-cost everyday generation |
| Seedream 5.0 Pro | seedream-5-0-pro | ByteDance | 1K / 2K | Coordinate-driven region editing and Chinese instructions |
¹ wan2.7-image-pro supports 4K only for text-to-image; generations with reference images are limited to 2K. The OpenAPI reference lists GPT-Image-2.5 Flare and Sunburst; the model directory lists 1K / 2K / 4K and 10 aspect ratios, while the integration guide has not yet added the variants to its model list. Both variants support up to four reference images and cost the same. Check estimate_credits for the current price before generation.
GitHub · npm · MCP Registry · Glama · 中文文档
Requires Node.js 20.9 or later.
LABNANA_API_KEY available in the environment used by Claude Code.claude mcp add labnana -- npx -y @exoticknight/labnana-mcp
The package can also be started directly with:
npx -y @exoticknight/labnana-mcp
Add the server through DSH's official MCP client plugin. Pin 2.2.0 when you want the version shown by initialize to identify this MCP Apps-capable build:
- id: mcp-labnana
name: '@deepseek-ai/dsh-mcp-client' config: serverName: labnana transport: stdio command: npx args: ['-y', '@exoticknight/labnana-mcp@2.2.0'] env: LABNANA_API_KEY: !!js process.env.LABNANA_API_KEY
DSH's MCP bridge can project supported ImageContent into the calling vision model. Version 2.1 also publishes a standard MCP Apps single-file View for generate_image and get_generation_task. An MCP Apps-capable DSH Web host renders the preview inline; a stock generic DSH tool card may still show the JSON fallback even though the model received the image. This is a client presentation limitation, not a lost generation result.
For a local source checkout, use the same row with command: node, an absolute args path to dist/index.js, and cwd set to this repository. Current stock DSH builds bridge MCP tools but do not consume MCP resources in the generic tool card. Without an MCP Apps host, model vision still works and the card falls back to JSON.
One-click install (replace the placeholder API key after installing):
Use an equivalent mcpServers configuration:
{
"mcpServers": { "labnana": { "command": "npx", "args": ["-y", "@exoticknight/labnana-mcp"], "env": { "LABNANA_API_KEY": "lh_xxxxxxxxx" } } } }
npm install
npm run build
Then configure the server with the generated dist/index.js:
claude mcp add labnana -- node <path-to-repo>/dist/index.js
On Windows, use an absolute path such as:
claude mcp add labnana -- node C:/path/to/labnana-mcp/dist/index.js
The server reads the following environment variable:
| Variable | Required | Description |
|---|---|---|
LABNANA_API_KEY | Yes | Labnana API key. |
LABNANA_OUTPUT_DIR | No | Default directory for saved images. Falls back to labnana-images/ under the working directory. |
The command-line options below are also supported:
| Option | Description |
|---|---|
--api-key | Provide the API key for a local process. |
--base-url | Override the default API endpoint, https://api.labnana.com. |
--output-dir | Default directory for saved images. |
Environment variables are recommended because command-line arguments may be visible in the local process list.
| Tool | Description |
|---|---|
generate_image | One-stop text-to-image / image-to-image / editing. Saves the original and returns a bounded MCP image preview, structured metadata, and JSON fallback by default; 4K requests poll internally. |
estimate_credits | Estimate the credits required for a generation without generating an image. |
get_subscription | Get subscription status, credit balances, and free usage information. |
list_generation_tasks | List generation task history with pagination and optional status filtering. |
get_generation_task | Get task details and public image URLs (useful after a generate_image timeout). |
{
"name": "generate_image", "arguments": { "model": "gemini-3-pro-image", "prompt": "Change the background of the image to the grasslands of Inner Mongolia", "referenceImages": [ { "fileData": { "fileUri": "https://cdn.labnana.com/xxx.png", "mimeType": "image/png" } } ], "imageConfig": { "imageSize": "2K", "aspectRatio": "16:9" } } }
The default is outputMode=hybrid: the full original is saved to disk while a bounded MCP image preview, structuredContent, and equivalent JSON text are returned together. This provides progressive compatibility across Codex, Claude Code, Claude Desktop, and other MCP clients. Use saveDir to choose the target directory.
All 1K, 2K, 4K, and get_generation_task results use the same envelope:
{
"schemaVersion": 1, "status": "succeeded", "taskId": "task-123", "images": [ { "index": 0, "mimeType": "image/png", "width": 4096, "height": 4096, "byteLength": 18442231, "sha256": "...", "url": "https://.../original.png", "filePath": "C:\\...\\labnana.png", "preview": { "included": true, "mimeType": "image/jpeg", "width": 1600, "height": 1600 } } ] }
Image base64 appears only in standard MCP ImageContent, never duplicated into text or structured metadata. Full 4K originals are not inlined; previews have a maximum 1600-pixel edge and target a 2 MiB byte ceiling, while filePath/url locate the original.
Use referenceImages for image-to-image generation and editing. fileData.fileUri supports gs:// and https://; small images can be passed as base64 through inlineData.data.
4K requests automatically run as asynchronous tasks: the server creates the task, polls with rate-limit backoff, downloads and saves originals, and creates previews. If the wait exceeds timeoutSeconds (default 300), the result has status=pending and a taskId; this is not treated as generation failure. Fetch the final preview and original URL later with get_generation_task.
{
"name": "estimate_credits", "arguments": { "prompt": "A Shiba Inu running through a snowy landscape", "imageConfig": { "imageSize": "4K" } } }
model (default: gemini-3-pro-image): gemini-3-pro-image, gemini-3.1-flash-image, gpt-image-2, gpt-image-2.5-flare, gpt-image-2.5-sunburst, wan2.7-image-pro, wan2.7-image, or seedream-5-0-pro. The provider is derived from the model automatically. Use estimate_credits to confirm a GPT-Image-2.5 size and cost before generation.imageConfig.imageSize: 1K, 2K, or 4K. wan2.7-image and seedream-5-0-pro do not support 4K; wan2.7-image-pro also disallows 4K when reference images are present.imageConfig.aspectRatio: 1:1, 2:3, 3:2, 3:4, 4:3, 4:5, 5:4, 9:16, 16:9, 21:9, 1:4, 4:1, 1:8, or 8:1. GPT-Image-2 may omit this field and let the service choose; GPT-Image-2.5 supports the ten ratios from 1:1 through 21:9; Wan2.7 supports only 1:1, 16:9, 9:16, 4:3, and 3:4.referenceImages: OpenAPI allows up to 14 for Gemini, 4 for GPT-Image-2 / GPT-Image-2.5, 9 for Wan2.7, and 10 for Seedream. These are API limits, not the separate upload limits of the web generator.referenceImages and describe the target region and change in prompt using absolute coordinates from the top-left origin. OpenAPI has no separate mask or region parameter.outputMode (generate_image only): hybrid (default, save originals and inline bounded previews), file (save originals and return metadata only), or inline (do not save to saveDir; return a bounded preview, and persist the original to the default recovery directory only when the upstream response has no original URL).saveDir / timeoutSeconds (generate_image only): target directory for hybrid/file mode, and the maximum wait for async (4K) generations.| Model | 1K | 2K | 4K |
|---|---|---|---|
gemini-3-pro-image | 15 | 15 | 30 |
gemini-3.1-flash-image | 10 | 10 | 20 |
gpt-image-2 | 4 | 6 | 10 |
wan2.7-image-pro | 6 | 8 | 12 (text-to-image only) |
wan2.7-image | 4 | 6 | Not supported |
seedream-5-0-pro | 6 | 15 | Not supported |
GPT-Image-2.5 Flare and Sunburst have the same price, but the integration guide does not list their size-specific credit values. Call estimate_credits with the intended model and imageConfig for the current
冒頭だけを表示しています。続きはリポジトリで読めます