Figma Context MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
คำอธิบายจากผู้ทำ (ภาษาอังกฤษตามต้นฉบับ)
Your AI designs live on the UX Pilot canvas or runs its design agent: reviews, React, video, media
สามเรื่องนี้ไม่รวมเป็นคะแนนเดียว เพราะความเห็น การวัด และความนิยม เป็นคนละเรื่องกัน
ตัวนี้ยังไม่ได้เรียบเรียงเป็นภาษาไทย ด้านล่างคือข้อเท็จจริงที่เราอ่านจาก registry
เลือกโปรแกรม AI ที่คุณใช้ แล้วคัดลอกค่าตั้งไปวาง
ต้องเตรียมก่อน
คุณใช้แอปไหน
เลือกแอปด้านบน เราจำไว้ให้ ครั้งหน้าปุ่มจะขึ้นว่า “ติดตั้งลง …”
ใช้ได้ทั้ง Claude บนเว็บ แอปคอมพิวเตอร์ และมือถือ:
https://mcp.uxpilot.net/mcpพิมพ์คำสั่งนี้ใน Terminal
claude mcp add --transport http uxpilot https://mcp.uxpilot.net/mcpวางในไฟล์ .cursor/mcp.json ของโปรเจกต์ หรือ ~/.cursor/mcp.json
{
"mcpServers": {
"uxpilot": {
"url": "https://mcp.uxpilot.net/mcp"
}
}
}เบราว์เซอร์จะถามก่อนเปิดแอป จากนั้นแอปแสดงค่าตั้งให้ตรวจแล้วกดยืนยัน ช่อง key เว้นว่างไว้ให้คุณใส่เอง
วางในไฟล์ .vscode/mcp.json ของโปรเจกต์
{
"servers": {
"uxpilot": {
"type": "http",
"url": "https://mcp.uxpilot.net/mcp"
}
}
}เบราว์เซอร์จะถามก่อนเปิดแอป จากนั้นแอปแสดงค่าตั้งให้ตรวจแล้วกดยืนยัน ช่อง key เว้นว่างไว้ให้คุณใส่เอง
ChatGPT ต่อได้เฉพาะ server ที่อยู่บนอินเทอร์เน็ต:
https://mcp.uxpilot.net/mcpชื่อเมนูอาจต่างกันเล็กน้อยตามแพ็กเกจและรุ่นของแอป
ตัวเลือกเก็บในคุกกี้บนเครื่องนี้ ไม่ต้องมีบัญชี
ค่าตั้งนี้สร้างจากข้อมูลใน registry ของผู้ทำ ถ้าไม่ตรงกับ README ให้เชื่อ README
ยังไม่ได้อ่านรายการเครื่องมือของตัวนี้ เราตรวจ endpoint ทีละชุดวนไป
เราตรวจจากข้อมูลที่ใครก็เปิดดูได้ ยังไม่ได้อ่านโค้ด ข้อที่ไม่เกี่ยวกับตัวนี้ไม่นับในตัวหาร · ตรวจเมื่อ 6 พ.ย. 2569
ชื่อใน registry ยืนยันโดเมน uxpilot.ai แล้ว (registry ตรวจความเป็นเจ้าของโดเมน)
ยังไม่ได้อ่านข้อมูล repo จาก GitHub
ยังไม่ได้อ่านข้อมูล repo จาก GitHub
ยังไม่ได้ตรวจ เราตรวจ endpoint ทีละชุดวนไป
ยังไม่ได้ตรวจ เราตรวจ endpoint ทีละชุดวนไป
ยังไม่ได้ตรวจ เราอ่านรายการเครื่องมือตอนตรวจ endpoint
เทียบกับทุก server ที่ยังใช้งานในหมวดนี้ทั้งทะเบียน ดาวนับเฉพาะเมื่อผู้ลงทะเบียนเป็นเจ้าของ repo
จากการตรวจเบื้องต้นของเรา ผ่าน 1 จาก 1 ข้อที่ตรวจได้ เรายังไม่ได้อ่านโค้ด ก่อนใส่กุญแจหรือ token ให้ดูว่า server ขอสิทธิ์อะไร และเลือกกุญแจที่ทำได้เท่าที่จำเป็น
registry ไม่ได้ระบุว่าต้องใช้กุญแจ แต่บางตัวจะขอให้ล็อกอินตอนใช้ครั้งแรก
รันบนคลาวด์ของผู้ทำ ต่อผ่านอินเทอร์เน็ตได้เลย ไม่ต้องลงโปรแกรม แต่ข้อมูลที่ส่งให้จะผ่านเซิร์ฟเวอร์ของผู้ทำ
repo บน GitHub มีการแก้โค้ดล่าสุด – และส่งรุ่นล่าสุด (3.0.0) เข้า registry เมื่อวานซืน
โปรแกรมที่รองรับ MCP เช่น Claude Desktop, Claude Code, Cursor และ VS Code ตัวนี้ต่อผ่าน URL จึงใช้กับโปรแกรมที่รับ remote MCP ได้ เช่น ChatGPT ที่เปิดโหมดนักพัฒนา
ในหมวดเดียวกันมี Figma Context MCP, Claude Real Video, Figma MCP Server
server หมวดเดียวกันจากผู้ทำคนอื่น เรียงตามดาว
อ่านการ์ด:★ ดาว GitHubiสามเสา: รีวิว · ผลตรวจ · การใช้งานiอัปเดต = วันที่ส่งรุ่นล่าสุดเข้า registryi
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.
server ทางการของ Figma ส่งข้อมูลงานออกแบบให้ AI อ่าน เพื่อเปลี่ยนแบบเป็นโค้ดหรืออธิบายแบบได้ตรงขึ้น ต่อผ่านคลาวด์ของ Figma
ส่วนนี้คัดจาก repo ของผู้ทำตามต้นฉบับ PopNx MCP ไม่ได้ตรวจหรือรับรองเนื้อหา ตัด HTML รูปภาพ และสคริปต์ออกแล้ว ลิงก์จะพาออกนอกเว็บ
Design, edit and review in UX Pilot from Claude, ChatGPT, Cursor, Codex, and other MCP clients.
Your AI builds screens live on the UX Pilot canvas, or hands the brief to UX Pilot's own design agent. Then it reviews, versions and ships the work: React prototypes, preview links, videos and media.
The UX Pilot MCP server connects any MCP-compatible AI client to your UX Pilot workspace. Version 3.0 has 15 general tools. Each one covers a kind of work (find, read, edit, review, export and so on), and you choose the action inside the tool. That keeps the tool list short and leaves more of your AI's context for the work.
The server is hosted by UX Pilot. This repository documents how to connect to it and what it exposes. There is no server code here to build or run.
https://mcp.uxpilot.net/mcpAuthorization: Bearer API key fallbackFree UX Pilot accounts can connect and use every tool:
Paid plans have no weekly action limit. See uxpilot.ai/plans.
If your AI tool shows a UX Pilot sign-in or authorization screen, choose that flow. You log in with your UX Pilot account, review the requested access, and approve the connection. No API key to copy or paste, and access stays tied to your account and plan.
For clients that only support static headers, generate a key from the API Keys tab in your UX Pilot workspace and send it as a bearer token:
Authorization: Bearer ep_your_api_key
Enterprise workspaces: your admin manages MCP/API keys. Keep the key private and rotate it if access changes.
Prefer native sign-in wherever the client supports it. Use the API key config as a fallback. Replace ep_your_api_key with your real key.
Claude
Native connector (recommended):
https://mcp.uxpilot.net/mcpClaude Code:
claude mcp add --transport http uxpilot https://mcp.uxpilot.net/mcp
Then run /mcp in Claude Code and sign in.
API key fallback (Claude Desktop, via `mcp-remote`): edit claude_desktop_config.json (macOS: ~/Library/Application Support/Claude/claude_desktop_config.json, Windows: %APPDATA%\Claude\claude_desktop_config.json)
{
"mcpServers": { "uxpilot": { "command": "npx", "args": [ "-y", "mcp-remote", "https://mcp.uxpilot.net/mcp", "--transport", "http-only", "--header", "Authorization:${AUTH_HEADER}" ], "env": { "AUTH_HEADER": "Bearer ep_your_api_key" } } } }
Requires Node.js. mcp-remote bridges stdio to Streamable HTTP.
ChatGPT
Use ChatGPT's custom connector / MCP support (Developer mode, availability depends on your plan):
https://mcp.uxpilot.net/mcpCursor
Add to ~/.cursor/mcp.json (global) or .cursor/mcp.json (project). For native sign-in, add only the url. Keep the headers block only for the API key fallback.
{
"mcpServers": { "uxpilot": { "url": "https://mcp.uxpilot.net/mcp", "headers": { "Authorization": "Bearer ep_your_api_key" } } } }
VS Code + Copilot
Add to .vscode/mcp.json:
{
"servers": { "uxpilot": { "type": "http", "url": "https://mcp.uxpilot.net/mcp", "headers": { "Authorization": "Bearer ep_your_api_key" } } } }
Windsurf
Add to ~/.codeium/windsurf/mcp_config.json:
{
"mcpServers": { "uxpilot": { "serverUrl": "https://mcp.uxpilot.net/mcp", "headers": { "Authorization": "Bearer ep_your_api_key" } } } }
Codex
Add to ~/.codex/config.toml:
[mcp_servers.uxpilot]
url = "https://mcp.uxpilot.net/mcp" bearer_token_env_var = "UXPILOT_API_KEY"
Then export the raw key (no Bearer prefix; Codex adds it):
export UXPILOT_API_KEY="ep_your_api_key"
Any MCP client
Clients that do not speak Streamable HTTP can bridge through mcp-remote:
{
"mcpServers": { "uxpilot": { "command": "npx", "args": [ "-y", "mcp-remote", "https://mcp.uxpilot.net/mcp", "--transport", "http-only", "--header", "Authorization:${AUTH_HEADER}" ], "env": { "AUTH_HEADER": "Bearer ep_your_api_key" } } } }
15 tools. Most take a kind or action that picks what to do, and a params object with that action's fields. Ask the server with guide({ topic: " . " }), for example guide({ topic: "edit.patch" }), for an action's fields and an example.
| Tool | What it does | kind / action | Needs your OK |
|---|---|---|---|
find | Find work: pages, folders, screens and React apps by keyword, themes, symbols, design systems, diagrams, React files and code | pages, workstreams, designs, react_projects, themes, symbols, design_systems, diagrams, react_files, react_code | |
read | Read one thing in full: a page with its canvas, layout or picture, a screen and its HTML, versions and diffs, a preview link, design checks, a design system and its guide, review scores, comments | page, design, designs, versions, version_diff, preview, checks, theme, symbol, design_system, design_system_guide, react_file, review_scores, comments | |
catalog | What you can pick from: design tiers, media models, review and export types, and what each paid call costs | tiers, media_models, media_kinds, reviews, exports, credits | |
guide | Short how-to docs: ways to design, the canvas, small steps, HTML, videos, React, design systems, reviews, the free plan, confirmations | topic | |
get_job | Follow a running job: design runs, React edits, videos, imports, reviews, video exports, design system imports | agent, generation, review, export, design_system_import | |
stop_job | Stop a design, React or video run | ||
edit | Change content with no AI and no credits: patch a screen's HTML one section at a time, replace it, save a version, make a version from comments, edit React files or a diagram | patch, replace, save_version, version_from_comments, react_files, diagram | |
manage | Organize, never delete: pages, templates, bookmarks, folders, groups, screens, canvas notes and shapes, images, diagrams, comments and replies, accessibility reports | create_page, page_from_template, update_page, bookmark_page, move_page, create_workstream, update_workstream, create_group, update_group, save_group, move_group, duplicate_design, move_design, update_design, save_design, add_items, update_items, update_assets, create_diagram, comment, reply, update_comment, update_reply, resolve_comment, resolve_comments, accessibility_report | |
import | Bring things in: your HTML as a new screen (free), a live URL, images by URL or upload, a design system from code, a repository, a website or tokens | html, url, assets, upload, design_system | Credits (url, html with AI refine, or a design system from code, a repository or a website; tokens are free) |
delete | Delete pages, folders, groups, canvas items, images, diagrams, comments and replies, or archive a screen | page, workstream, group, design, canvas_items, canvas_assets, diagram, comment, reply | Always |
design | UX Pilot's AI: the design agent for screens, flows or a new React app on the standard, pro or ultra tier, screens into a React app, React changes from a prompt, flowcharts | agent, react, react_edit, flowchart, flowchart_edit | Credits (flowcharts are free) |
make_video | Make or change a video from a brief: product reel, ad, explainer, social clip or logo animation, in 16:9, 9:16 or 1:1 | Credits | |
generate_media | Make media for a page: images, image edits, image processing, voiceovers, music, sound effects | image, edit_image, process_image, voiceover, music, sound_effect | Credits |
review | Review a screen, raw HTML or a live URL: UX review, persona review, attention heatmap, gaze flow (these two also take a screenshot). apply: true fixes ux, persona or accessibility issues as a new version | ux, persona, heatmap, gaze_flow, accessibility | Credits (a persona review is free) |
export | Export a video as MP4, WebM or GIF, publish a public preview link, publish or rebuild a React app | video, preview, prototype, react_build | Credits for a preview link or a React app publish; a rebuild asks first; video export is free |
Calls that spend credits, publish or delete stop and ask first:
confirmationToken instead of running.confirmed: true and the token. The token is tตัดมาแค่ช่วงต้น อ่านต่อใน repo