Figma Context MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
ยังไม่มีคำอธิบายภาษาไทย ดูข้อเท็จจริงด้านล่าง หรือเปิดคำอธิบายต้นฉบับจากผู้ทำ
Multi-provider media generation — images, video, audio, and transcription via a unified interfaceเลือกโปรแกรม AI ที่คุณใช้ แล้วคัดลอกค่าตั้งไปวาง
ผลตรวจผ่าน 2/3 · ทำงานบนเครื่องคุณ
ขั้นแรก: คุณใช้ AI ตัวไหน
เลือกแอปที่คุณใช้ ขั้นตอนจะขึ้นด้านล่าง
ต่อกับ Claude ได้ แต่ต้องเตรียมก่อน
ต้องมีคีย์ของ Multimodal (สร้างที่เว็บของผู้ทำ) · ต้องลง Node.js ในเครื่องก่อน (ทำครั้งเดียว) · ใช้ได้เฉพาะแอป Claude บนคอม (Windows หรือ Mac) ไม่ใช่บนเว็บหรือมือถือ
เปิดเว็บของผู้ทำ สมัครบัญชีแล้วสร้างคีย์ (API key) เก็บไว้ ใช้ในขั้นถัดไป ราคาและแผนฟรีดูที่เว็บของผู้ทำ
วิธีขอคีย์อยู่ใน README ของผู้ทำด้านล่าง
SettingsDeveloperEdit Config
กำลังตรวจคำสั่ง · ปุ่มคัดลอกจะขึ้นเมื่อตรวจผ่าน
วางคีย์ในช่องของแอปเท่านั้น อย่าวางในแชตหรือส่งให้ใคร
ใช้ Multimodal บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง✓ ถ้า Claude บอกว่ากำลังใช้ Multimodal หรือมีชื่อเครื่องมือของ Multimodal ขึ้นในคำตอบ แปลว่าต่อสำเร็จ
ชื่อเมนูตรวจกับหน้าช่วยเหลือของ Anthropic เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป
ChatGPT ยังต่อ Multimodal ไม่ได้
Multimodal ต้องติดตั้งในเครื่องคุณ แต่ ChatGPT ต่อได้เฉพาะตัวที่ทำงานบนเว็บ
ก · ใช้แอปที่ต่อ Multimodal ได้
ข · ตัวอื่นในหมวด ออกแบบ ภาพ และเสียง ที่ต่อกับ ChatGPT ได้
เลือกจากตัวที่ใช้มากในหมวดเดียวกัน เฉพาะตัวที่ต่อด้วยที่อยู่ได้โดยไม่ต้องใส่คีย์
ต่อกับ Claude Code ได้ แต่ต้องเตรียมก่อน
ต้องมีคีย์ของ Multimodal (สร้างที่เว็บของผู้ทำ) · ต้องลง Node.js ในเครื่องก่อน (ทำครั้งเดียว)
เปิดเว็บของผู้ทำ สมัครบัญชีแล้วสร้างคีย์ (API key) เก็บไว้ ใช้ในขั้นถัดไป ราคาและแผนฟรีดูที่เว็บของผู้ทำ
วิธีขอคีย์อยู่ใน README ของผู้ทำด้านล่าง
Mac: กด Command+Space พิมพ์ Terminal · Windows: เปิด PowerShell
กำลังตรวจคำสั่ง · ปุ่มคัดลอกจะขึ้นเมื่อตรวจผ่าน
แก้ “ใส่ค่าของคุณ” เป็นคีย์ของคุณก่อนกด Enter
วางคีย์ในช่องของแอปเท่านั้น อย่าวางในแชตหรือส่งให้ใคร
ต้องเห็น Multimodal ในรายการและขึ้นว่าเชื่อมต่อแล้ว
ใช้ Multimodal บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง✓ ถ้า Claude Code บอกว่ากำลังใช้ Multimodal หรือมีชื่อเครื่องมือของ Multimodal ขึ้นในคำตอบ แปลว่าต่อสำเร็จ
ชื่อเมนูตรวจกับหน้าช่วยเหลือของ Anthropic เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป
ต่อกับ Cursor ได้ แต่ต้องเตรียมก่อน
ต้องมีคีย์ของ Multimodal (สร้างที่เว็บของผู้ทำ) · ต้องลง Node.js ในเครื่องก่อน (ทำครั้งเดียว)
เปิดเว็บของผู้ทำ สมัครบัญชีแล้วสร้างคีย์ (API key) เก็บไว้ ใช้ในขั้นถัดไป ราคาและแผนฟรีดูที่เว็บของผู้ทำ
วิธีขอคีย์อยู่ใน README ของผู้ทำด้านล่าง
กำลังตรวจคำสั่ง · ปุ่มคัดลอกจะขึ้นเมื่อตรวจผ่าน
ในค่าตั้งของ Multimodal ช่อง OPENAI_API_KEY, XAI_API_KEY, GEMINI_API_KEY, ELEVENLABS_API_KEY, BFL_API_KEY, MEDIA_OUTPUT_DIR ยังว่าง ใส่คีย์ของคุณแล้วบันทึก
วางคีย์ในช่องของแอปเท่านั้น อย่าวางในแชตหรือส่งให้ใคร
ใช้ Multimodal บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง✓ ถ้า Cursor บอกว่ากำลังใช้ Multimodal หรือมีชื่อเครื่องมือของ Multimodal ขึ้นในคำตอบ แปลว่าต่อสำเร็จ
ชื่อเมนูตรวจกับหน้าช่วยเหลือของ Cursor เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป
ต่อกับ VS Code ได้ แต่ต้องเตรียมก่อน
ต้องมีคีย์ของ Multimodal (สร้างที่เว็บของผู้ทำ) · ต้องลง Node.js ในเครื่องก่อน (ทำครั้งเดียว)
เปิดเว็บของผู้ทำ สมัครบัญชีแล้วสร้างคีย์ (API key) เก็บไว้ ใช้ในขั้นถัดไป ราคาและแผนฟรีดูที่เว็บของผู้ทำ
วิธีขอคีย์อยู่ใน README ของผู้ทำด้านล่าง
กำลังตรวจคำสั่ง · ปุ่มคัดลอกจะขึ้นเมื่อตรวจผ่าน
ในค่าตั้งของ Multimodal ช่อง OPENAI_API_KEY, XAI_API_KEY, GEMINI_API_KEY, ELEVENLABS_API_KEY, BFL_API_KEY, MEDIA_OUTPUT_DIR ยังว่าง ใส่คีย์ของคุณแล้วบันทึก
วางคีย์ในช่องของแอปเท่านั้น อย่าวางในแชตหรือส่งให้ใคร
ใช้ Multimodal บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง✓ ถ้า VS Code บอกว่ากำลังใช้ Multimodal หรือมีชื่อเครื่องมือของ Multimodal ขึ้นในคำตอบ แปลว่าต่อสำเร็จ
ชื่อเมนูตรวจกับหน้าช่วยเหลือของ VS Code เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป
Claude Code
กำลังตรวจคำสั่ง · ปุ่มคัดลอกจะขึ้นเมื่อตรวจผ่าน
Claude Desktop (claude_desktop_config.json)
กำลังตรวจคำสั่ง · ปุ่มคัดลอกจะขึ้นเมื่อตรวจผ่าน
Cursor (~/.cursor/mcp.json)
กำลังตรวจคำสั่ง · ปุ่มคัดลอกจะขึ้นเมื่อตรวจผ่าน
VS Code (mcp.json)
กำลังตรวจคำสั่ง · ปุ่มคัดลอกจะขึ้นเมื่อตรวจผ่าน
OPENAI_API_KEY ความลับ envXAI_API_KEY ความลับ envGEMINI_API_KEY ความลับ envELEVENLABS_API_KEY ความลับ envBFL_API_KEY ความลับ envMEDIA_OUTPUT_DIR envค่าตั้งนี้สร้างจากข้อมูลใน registry ของผู้ทำ ถ้าไม่ตรงกับ README ให้เชื่อ README
ดูจากแบบการต่อของ server ตัวนี้ และเอกสารของผู้ทำโปรแกรมแต่ละตัว ตรวจเมื่อ 10 พ.ย. 2569
ติดตั้งบนเครื่องได้ใน
ClaudeGooseLM StudioMsty StudioCherry StudioCursorVS Code + GitHub CopilotVisual StudioWindsurf (Devin Desktop)ZedKiroClineContinueJetBrains AI AssistantClaude CodeCodex CLIGemini CLIOpenCodenodecodeWarpLibreChatRaycast
รันในเครื่องคุณ รายการเครื่องมือจะขึ้นในแอป AI หลังติดตั้ง
เราตรวจจากข้อมูลที่ใครก็เปิดดูได้ ยังไม่ได้อ่านโค้ด ข้อที่ไม่เกี่ยวกับตัวนี้ไม่นับในตัวหาร · ตรวจเมื่อ 13 พ.ย. 2569
ชื่อใน registry ยืนยันด้วยบัญชี GitHub rsmdt ซึ่งเป็นเจ้าของ repo
แก้โค้ดล่าสุด 8 เดือนที่ผ่านมา นานกว่า 6 เดือน
ใช้ MIT
ตัวนี้รันบนเครื่องคุณ ไม่มี endpoint บนอินเทอร์เน็ต
ตัวนี้รันบนเครื่อง ใช้ค่าที่ตั้งในเครื่องแทน
รันในเครื่องคุณ เราอ่านรายการเครื่องมือได้เฉพาะตัวที่มี endpoint บนอินเทอร์เน็ต
ถาม แชร์เคล็ดลับ หรือแจ้งว่าใช้ไม่ได้ เรียงตามที่คนกดว่ามีประโยชน์
ยังไม่มีใครโพสต์ ถามหรือแชร์เป็นคนแรกได้เลย
ข้อความในส่วนนี้เขียนโดยผู้ใช้ ไม่ใช่ทีม PopNx
ยังไม่มีรีวิว
เทียบกับทุก server ที่ยังใช้งานในหมวดนี้ทั้งทะเบียน ดาวนับเฉพาะเมื่อผู้ลงทะเบียนเป็นเจ้าของ repo
จากการตรวจเบื้องต้นของเรา ผ่าน 2 จาก 3 ข้อที่ตรวจได้ เรายังไม่ได้อ่านโค้ด ก่อนใส่กุญแจหรือ token ให้ดูว่า server ขอสิทธิ์อะไร และเลือกกุญแจที่ทำได้เท่าที่จำเป็น
ต้องใส่ค่าเหล่านี้: OPENAI_API_KEY, XAI_API_KEY, GEMINI_API_KEY, ELEVENLABS_API_KEY, BFL_API_KEY
รันบนเครื่องของคุณ โปรแกรม AI จะเปิด server ขึ้นมาเองเมื่อใช้ ข้อมูลไม่ต้องผ่านเซิร์ฟเวอร์ของผู้ทำ (ยกเว้นตัวที่ไปเรียกบริการออนไลน์ต่อ)
repo บน GitHub มีการแก้โค้ดล่าสุด 8 เดือนที่ผ่านมา และส่งรุ่นล่าสุด (1.3.1) เข้า registry 8 เดือนที่ผ่านมา
โปรแกรมที่รองรับ MCP เช่น Claude Desktop, Claude Code, Cursor และ VS Code ตัวนี้ต้องมี Node.js ในเครื่องด้วย
ในหมวดเดียวกันมี Figma Context MCP, AutoClip, Next AI Draw.io
server หมวดเดียวกันจากผู้ทำคนอื่น เรียงตามดาว
อ่านการ์ด:↓ ดาวน์โหลดต่อสัปดาห์i★ ดาว GitHubiสามเสา: รีวิว · ผลตรวจ · การใช้งานiอัปเดต = วันที่ส่งรุ่นล่าสุดเข้า registryi
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
Clip long videos into short clips with covers and captions. Local CLI and MCP.
draw.io diagrams your AI agent draws on a live browser canvas that you can also edit by hand
ส่วนนี้คัดจาก repo ของผู้ทำตามต้นฉบับ PopNx MCP ไม่ได้ตรวจหรือรับรองเนื้อหา ตัด HTML รูปภาพ และสคริปต์ออกแล้ว ลิงก์จะพาออกนอกเว็บ
Multi-provider media generation MCP server. Generate images, videos, audio, and transcriptions from text prompts using OpenAI, xAI, Gemini, ElevenLabs, and BFL (FLUX) through a single unified interface.
Set the API key for at least one provider. Most users only need one — add more to access additional providers.
# Using OpenAI
claude mcp add multimodal-mcp -e OPENAI_API_KEY=sk-... -- npx -y @r16t/multimodal-mcp@latest
Using a different editor? See setup instructions for Claude Desktop, Cursor, VS Code, Windsurf, and Cline.
| Variable | Required | Description |
|---|---|---|
OPENAI_API_KEY | At least one provider key | OpenAI API key — enables image, video, audio generation, and transcription via gpt-image-1, sora-2, tts-1, and whisper-1 |
XAI_API_KEY | At least one provider key | xAI API key — enables image and video generation via grok-imagine-image and grok-imagine-video |
GEMINI_API_KEY | At least one provider key | Gemini API key — enables image, video, and audio generation via imagen-4, veo-3.1, and gemini-2.5-flash-preview-tts |
GOOGLE_API_KEY | — | Alias for GEMINI_API_KEY; either name is accepted |
ELEVENLABS_API_KEY | At least one provider key | ElevenLabs API key — enables audio generation (TTS, sound effects) and transcription via Flash v2.5 and Scribe v1 |
BFL_API_KEY | At least one provider key | BFL API key — enables image generation and editing via FLUX Pro 1.1 and FLUX Kontext |
MEDIA_OUTPUT_DIR | No | Directory for saved media files. Defaults to the current working directory |
generate_imageGenerate an image from a text prompt.
| Parameter | Type | Required | Description |
|---|---|---|---|
prompt | string | Yes | Text description of the image to generate |
provider | string | No | Provider to use: openai, xai, google, bfl. Auto-selects if omitted |
aspectRatio | string | No | Aspect ratio: 1:1, 16:9, 9:16, 4:3, 3:4 |
quality | string | No | Quality level: low, standard, high |
outputDirectory | string | No | Directory to save the generated file. Absolute or relative path. Defaults to MEDIA_OUTPUT_DIR or cwd |
providerOptions | object | No | Provider-specific parameters passed through directly |
generate_videoGenerate a video from a text prompt. Video generation is asynchronous and may take several minutes.
| Parameter | Type | Required | Description |
|---|---|---|---|
prompt | string | Yes | Text description of the video to generate |
provider | string | No | Provider to use: openai, xai, google. Auto-selects if omitted |
duration | number | No | Video duration in seconds (provider limits apply) |
aspectRatio | string | No | Aspect ratio: 16:9, 9:16, 1:1 |
resolution | string | No | Resolution: 480p, 720p, 1080p |
outputDirectory | string | No | Directory to save the generated file. Absolute or relative path. Defaults to MEDIA_OUTPUT_DIR or cwd |
providerOptions | object | No | Provider-specific parameters passed through directly |
generate_audioGenerate audio from text. Supports text-to-speech and sound effects. Audio generation is synchronous.
| Parameter | Type | Required | Description |
|---|---|---|---|
text | string | Yes | Text to convert to speech, or a description of the sound effect to generate |
provider | string | No | Provider to use: openai, google, elevenlabs. Auto-selects if omitted |
voice | string | No | Voice name (provider-specific). OpenAI: alloy, ash, coral, echo, fable, nova, onyx, sage, shimmer. Google: Kore, Charon, Fenrir, Aoede, Puck, etc. ElevenLabs: voice ID |
speed | number | No | Speech speed multiplier (OpenAI only): 0.25 to 4.0 |
format | string | No | Output format (OpenAI only): mp3, opus, aac, flac, wav, pcm |
outputDirectory | string | No | Directory to save the generated file. Absolute or relative path. Defaults to MEDIA_OUTPUT_DIR or cwd |
providerOptions | object | No | Provider-specific parameters passed through directly. ElevenLabs: set mode: "sound-effect" for sound effects, model for TTS model selection |
transcribe_audioTranscribe audio to text (speech-to-text).
| Parameter | Type | Required | Description |
|---|---|---|---|
audioPath | string | Yes | Absolute path to the audio file to transcribe |
provider | string | No | Provider to use: openai, elevenlabs. Auto-selects if omitted |
language | string | No | Language code (e.g., en, fr, es) to hint the transcription language |
providerOptions | object | No | Provider-specific parameters passed through directly |
list_providersList all configured media generation providers and their capabilities. Takes no parameters.
| Provider | Image | Image Editing | Video | Audio | Transcription | Key Models |
|---|---|---|---|---|---|---|
| OpenAI | ✅ | ✅ | ✅ | ✅ | ✅ | gpt-image-1, sora-2, tts-1, whisper-1 |
| xAI | ✅ | ✅ | ✅ | — | — | grok-imagine-image, grok-imagine-video |
| Gemini | ✅ | ✅ | ✅ | ✅ | — | imagen-4, veo-3.1, gemini-2.5-flash-preview-tts |
| ElevenLabs | — | — | — | ✅ | ✅ | eleven_flash_v2_5, scribe_v1 |
| BFL | ✅ | ✅ | — | — | — | flux-pro-1.1, flux-kontext-pro |
| Provider | 1:1 | 16:9 | 9:16 | 4:3 | 3:4 |
|---|---|---|---|---|---|
| OpenAI | ✅ | ✅ | ✅ | ✅ | ✅ |
| xAI | ✅ | ✅ | ✅ | ✅ | ✅ |
| Gemini | ✅ | ✅ | ✅ | ✅ | ✅ |
| BFL | ✅ | ✅ | ✅ | ✅ | ✅ |
| Provider | 16:9 | 9:16 | 1:1 | 480p | 720p | 1080p |
|---|---|---|---|---|---|---|
| OpenAI | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ |
| xAI | ✅ | ✅ | ✅ | — | ✅ | ✅ |
| Gemini | ✅ | ✅ | — | — | ✅ | ✅ |
| Provider | mp3 | opus | aac | flac | wav | pcm |
|---|---|---|---|---|---|---|
| OpenAI | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ |
| Gemini | — | — | — | — | ✅ | — |
| ElevenLabs | ✅ | ✅ | — | — | — | ✅ |
[config] No provider API keys detected
Set at least one of OPENAI_API_KEY, XAI_API_KEY, GEMINI_API_KEY, ELEVENLABS_API_KEY, or BFL_API_KEY in the MCP server's env block.
Each provider supports different media types (see Provider Capabilities). If you specify a provider that isn't configured (no API key) or doesn't support the requested media type, you'll receive an error. Omit the provider parameter to auto-select from configured providers.
Video generation polls for up to 10 minutes. If your video hasn't completed in that window, the request will fail with a timeout error. Try a shorter duration or a simpler prompt.
This indicates the xAI API returned an empty response. Check that your XAI_API_KEY is valid and that your prompt does not violate xAI content policies.
Verify your GEMINI_API_KEY has the Generative Language API enabled in Google Cloud Console.
npm run build # Compile TypeScript to build/
npm test # Run tests with Vitest npm run lint # Lint and auto-fix with ESLint npm run typecheck # Type-check without emitting npm run dev # Watch mode for TypeScript compilation
Replace OPENAI_API_KEY with your provider of choice (XAI_API_KEY, GEMINI_API_KEY, ELEVENLABS_API_KEY, BFL_API_KEY). You can set multiple keys to enable multiple providers.
Add to ~/Library/Application Support/Claude/claude_desktop_config.json:
{
"mcpServers": { "multimodal-mcp": { "command": "npx", "args": ["@r16t/multimodal-mcp@latest"], "env": { "OPENAI_API_KEY": "sk-..." } } } }
Add to .cursor/mcp.json in your project root (or ~/.cursor/mcp.json globally):
{
"mcpServers": { "multimodal-mcp": { "command": "npx", "args": ["@r16t/multimodal-mcp@latest"], "env": { "OPENAI_API_KEY": "sk-..." } } } }
Add to .vscode/mcp.json in your project root:
{
"servers": { "multimodal-mcp": { "command": "npx", "args": ["@r16t/multimodal-mcp@latest"], "env": { "OPENAI_API_KEY": "sk-..." } } } }
Add to ~/.codeium/windsurf/mcp_config.json:
{
"mcpServers": { "multimodal-mcp": { "command": "npx", "args": ["@r16t/multimodal-mcp@latest"], "env": { "OPENAI_API_KEY": "sk-..." } } } }
Add to ~/Library/Application Support/Code/User/globalStorage/saoudrizwan.claude-dev/settings/cline_mcp_settings.json:
{
"mcpServers": { "multimodal-mcp": { "command": "npx", "args": ["@r16t/multimodal-mcp@latest"], "env": { "OPENAI_API_KEY": "sk-..." } } } }
MIT