Figma Context MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
ยังไม่มีคำอธิบายภาษาไทย ดูข้อเท็จจริงด้านล่าง หรือเปิดคำอธิบายต้นฉบับจากผู้ทำ
Architecture diagram with concurrency capacity and bottleneck estimates from any codebase.เลือกโปรแกรม AI ที่คุณใช้ แล้วคัดลอกค่าตั้งไปวาง
ผลตรวจผ่าน 3/3 · ทำงานบนเครื่องคุณ
ขั้นแรก: คุณใช้ AI ตัวไหน
เลือกแอปที่คุณใช้ ขั้นตอนจะขึ้นด้านล่าง
ต่อกับ Claude ได้ แต่ต้องเตรียมก่อน
ต้องลง Python (uv) ในเครื่องก่อน (ทำครั้งเดียว) · ใช้ได้เฉพาะแอป Claude บนคอม (Windows หรือ Mac) ไม่ใช่บนเว็บหรือมือถือ
ทำครั้งเดียว ใช้ได้กับทุกตัวที่ต้องใช้ Python (uv)
SettingsDeveloperEdit Config
{
"mcpServers": {
"workflow-generator": {
"command": "uvx",
"args": [
"workflow-generator-mcp"
]
}
}
}ใช้ Workflow Generator บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง✓ ถ้า Claude บอกว่ากำลังใช้ Workflow Generator หรือมีชื่อเครื่องมือของ Workflow Generator ขึ้นในคำตอบ แปลว่าต่อสำเร็จ
ชื่อเมนูตรวจกับหน้าช่วยเหลือของ Anthropic เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป
ChatGPT ยังต่อ Workflow Generator ไม่ได้
Workflow Generator ต้องติดตั้งในเครื่องคุณ แต่ ChatGPT ต่อได้เฉพาะตัวที่ทำงานบนเว็บ
ก · ใช้แอปที่ต่อ Workflow Generator ได้
ข · ตัวอื่นในหมวด ออกแบบ ภาพ และเสียง ที่ต่อกับ ChatGPT ได้
เลือกจากตัวที่ใช้มากในหมวดเดียวกัน เฉพาะตัวที่ต่อด้วยที่อยู่ได้โดยไม่ต้องใส่คีย์
ต่อกับ Claude Code ได้ แต่ต้องเตรียมก่อน
ต้องลง Python (uv) ในเครื่องก่อน (ทำครั้งเดียว)
ทำครั้งเดียว ใช้ได้กับทุกตัวที่ต้องใช้ Python (uv)
Mac: กด Command+Space พิมพ์ Terminal · Windows: เปิด PowerShell
claude mcp add --scope user workflow-generator -- uvx workflow-generator-mcpต้องเห็น Workflow Generator ในรายการและขึ้นว่าเชื่อมต่อแล้ว
ใช้ Workflow Generator บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง✓ ถ้า Claude Code บอกว่ากำลังใช้ Workflow Generator หรือมีชื่อเครื่องมือของ Workflow Generator ขึ้นในคำตอบ แปลว่าต่อสำเร็จ
ชื่อเมนูตรวจกับหน้าช่วยเหลือของ Anthropic เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป
ต่อกับ Cursor ได้ แต่ต้องเตรียมก่อน
ต้องลง Python (uv) ในเครื่องก่อน (ทำครั้งเดียว)
ทำครั้งเดียว ใช้ได้กับทุกตัวที่ต้องใช้ Python (uv)
ใช้ Workflow Generator บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง✓ ถ้า Cursor บอกว่ากำลังใช้ Workflow Generator หรือมีชื่อเครื่องมือของ Workflow Generator ขึ้นในคำตอบ แปลว่าต่อสำเร็จ
ชื่อเมนูตรวจกับหน้าช่วยเหลือของ Cursor เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป
ต่อกับ VS Code ได้ แต่ต้องเตรียมก่อน
ต้องลง Python (uv) ในเครื่องก่อน (ทำครั้งเดียว)
ทำครั้งเดียว ใช้ได้กับทุกตัวที่ต้องใช้ Python (uv)
ใช้ Workflow Generator บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง✓ ถ้า VS Code บอกว่ากำลังใช้ Workflow Generator หรือมีชื่อเครื่องมือของ Workflow Generator ขึ้นในคำตอบ แปลว่าต่อสำเร็จ
ชื่อเมนูตรวจกับหน้าช่วยเหลือของ VS Code เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป
Claude Code
claude mcp add --scope user workflow-generator -- uvx workflow-generator-mcpClaude Desktop (claude_desktop_config.json)
{
"mcpServers": {
"workflow-generator": {
"command": "uvx",
"args": [
"workflow-generator-mcp"
]
}
}
}Cursor (~/.cursor/mcp.json)
{
"mcpServers": {
"workflow-generator": {
"command": "uvx",
"args": [
"workflow-generator-mcp"
]
}
}
}VS Code (mcp.json)
{
"servers": {
"workflow-generator": {
"type": "stdio",
"command": "uvx",
"args": [
"workflow-generator-mcp"
]
}
}
}ค่าตั้งนี้สร้างจากข้อมูลใน 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 askuma ซึ่งเป็นเจ้าของ repo
มีการแก้โค้ดล่าสุด 18 วันที่ผ่านมา
ใช้ MIT
ตัวนี้รันบนเครื่องคุณ ไม่มี endpoint บนอินเทอร์เน็ต
ตัวนี้รันบนเครื่อง ใช้ค่าที่ตั้งในเครื่องแทน
รันในเครื่องคุณ เราอ่านรายการเครื่องมือได้เฉพาะตัวที่มี endpoint บนอินเทอร์เน็ต
ถาม แชร์เคล็ดลับ หรือแจ้งว่าใช้ไม่ได้ เรียงตามที่คนกดว่ามีประโยชน์
ยังไม่มีใครโพสต์ ถามหรือแชร์เป็นคนแรกได้เลย
ข้อความในส่วนนี้เขียนโดยผู้ใช้ ไม่ใช่ทีม PopNx
ยังไม่มีรีวิว
เทียบกับทุก server ที่ยังใช้งานในหมวดนี้ทั้งทะเบียน ดาวนับเฉพาะเมื่อผู้ลงทะเบียนเป็นเจ้าของ repo
จากการตรวจเบื้องต้นของเรา ผ่าน 3 จาก 3 ข้อที่ตรวจได้ เรายังไม่ได้อ่านโค้ด ก่อนใส่กุญแจหรือ token ให้ดูว่า server ขอสิทธิ์อะไร และเลือกกุญแจที่ทำได้เท่าที่จำเป็น
registry ไม่ได้ระบุว่าต้องใช้กุญแจ แต่บางตัวจะขอให้ล็อกอินตอนใช้ครั้งแรก
รันบนเครื่องของคุณ โปรแกรม AI จะเปิด server ขึ้นมาเองเมื่อใช้ ข้อมูลไม่ต้องผ่านเซิร์ฟเวอร์ของผู้ทำ (ยกเว้นตัวที่ไปเรียกบริการออนไลน์ต่อ)
repo บน GitHub มีการแก้โค้ดล่าสุด 18 วันที่ผ่านมา และส่งรุ่นล่าสุด (0.5.0) เข้า registry 18 วันที่ผ่านมา
โปรแกรมที่รองรับ MCP เช่น Claude Desktop, Claude Code, Cursor และ VS Code ตัวนี้ต้องมี Python (uv) ในเครื่องด้วย
ในหมวดเดียวกันมี 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 รูปภาพ และสคริปต์ออกแล้ว ลิงก์จะพาออกนอกเว็บ
Scan any project and generate WORKFLOW.html — a dark-mode visual system diagram showing every component, how they talk to each other, and where your throughput ceiling actually is.
Works with Python, Node.js, Go, Java, Rust, Ruby, and mixed projects. No external dependencies for the core scanner. Vendored and generated directories (node_modules, venv, site-packages, dist, …) are never scanned, and capacity figures are clearly labeled as static-analysis estimates.
[Live demo →](https://askuma.github.io/workflow-generator/) — generated from fastapi/full-stack-fastapi-template, unmodified.
*(real CLI output, unscripted — static screenshot if you'd rather not autoplay)*
Every generated page contains:
| Section | What you get |
|---|---|
| Stat row | Workers · Concurrent I/O ceiling · Semaphore limit · Rate limit · Practical throughput |
| Architecture diagram | Layered flow: external sources → gateway → API → queues → AI → storage |
| Data flow cards | Write path, read/query path, background jobs — inferred from what's detected |
| Concurrency table | Every layer: model · ceiling · limiting factor |
| Bottleneck analysis | Ranked CRITICAL → LOW with mitigation notes |
| Codebase dependency graph | Force-directed module/import graph — click a node to isolate its neighbors, hover for file details. Import-direction edges are clearly distinguished from real observed traffic (see below) |
| Guided tour | Spotlight walkthrough of every section, shown automatically the first time a report is opened; replay anytime with the ? button |
Every source file (Python, JS/TS, Go, Java, Rust, Ruby) becomes a node; every real import becomes an edge — resolved with a language-appropriate parser (Python's ast module, regex for JS/TS/Go/ Java/Rust/Ruby), not guessed. Files that match an already-detected component (an LLM call, a database client, a queue) get an edge to that component too, so you can see exactly which files talk to Redis, OpenAI, etc. Large repos (350+ files) are automatically aggregated into directory-level nodes so the graph stays readable; override with --graph-detail files or --graph-detail dirs.
Test files (tests/, test_*.py, conftest.py, *.spec.ts, *_test.go, …) get their own Test Graph section below the main one, showing which modules and services each test reaches. Fixtures and test doubles name every service they exercise, so keeping them in the main graph buries the real dependency structure under service edges.
Both sections have a Flow | Graph toggle over the same nodes and edges. Flow (the default up to 80 nodes) is a left-to-right layered diagram: columns are dependency depth from the sources (HTTP entry and files nothing imports), every detected service is its own node in the last column, and import cycles are drawn dashed. Graph is the force-directed view. Moving dots show data going both ways: a filled dot is the call/request, a hollow dot the return/response. On graphs with more than 60 edges, only the paths of the clicked or hovered node animate. Search, "hide isolated" and the selected node are shared between the two views.
The older layered Full System Architecture diagram is collapsed by default, since the Architecture Map covers the same ground.
By default the graph only shows what the *code* says (import direction, static "this file calls Redis"), which is honest but not the same as real traffic. Pass --access-log /path/to/access.log (any combined/common log format) to overlay real observed request counts onto the HTTP-entry edges — and the generated report includes a ready-to-run k6 load-test script covering up to 5 detected routes, so the "Practical throughput" number can be checked against a real measurement instead of only a static-analysis estimate.
| Category | Examples |
|---|---|
| API frameworks | FastAPI, Flask, Django, Express, Nest.js, Gin |
| Gateways | nginx, Caddy, Traefik (with rate limits + worker_connections) |
| LLM providers | OpenAI, Anthropic Claude, Cohere, AWS Bedrock |
| Vector stores | Qdrant, Pinecone, Weaviate, ChromaDB, pgvector, FAISS, Milvus |
| Databases | PostgreSQL, MySQL, MongoDB, SQLite, Redis |
| Queues | Celery, BullMQ, Kafka, RabbitMQ, RQ, AWS SQS |
| Async primitives | asyncio.Semaphore, run_in_executor, asyncio.gather, asyncio.Lock |
| Workers | --workers N (uvicorn/gunicorn), replicas: (docker-compose), PM2 instances |
| External sources | Jira, Azure DevOps, Slack, GitHub, Stripe, Salesforce, Twilio |
| Evaluation | TruLens, RAGAS, LangSmith |
pip install workflow-generator-mcp
workflow-generator . WORKFLOW.html # CLI: scan and write the report workflow-generator-mcp # stdio MCP server
With pip installed, any MCP host config reduces to:
{
"mcpServers": { "workflow-generator": { "command": "workflow-generator-mcp" } } }
mkdir -p ~/.claude/skills
git clone https://github.com/askuma/workflow-generator.git ~/.claude/skills/workflow-generator
Then in any Claude Code session:
/workflow-generator
/workflow-generator /path/to/project
1. Install the dependency:
pip install mcp
2. Add to your MCP host config (replace ~ with your actual home path):
Claude Desktop
~/Library/Application Support/Claude/claude_desktop_config.json (Mac) %APPDATA%\Claude\claude_desktop_config.json (Windows)
{
"mcpServers": { "workflow-generator": { "command": "python3", "args": ["~/.claude/skills/workflow-generator/mcp/server.py"] } } }
</details>
VS Code
.vscode/mcp.json
{
"servers": { "workflow-generator": { "type": "stdio", "command": "python3", "args": ["~/.claude/skills/workflow-generator/mcp/server.py"] } } }
</details>
Cursor
~/.cursor/mcp.json
{
"mcpServers": { "workflow-generator": { "command": "python3", "args": ["~/.claude/skills/workflow-generator/mcp/server.py"] } } }
</details>
Zed
.zed/settings.json
{
"context_servers": { "workflow-generator": { "command": { "path": "python3", "args": ["~/.claude/skills/workflow-generator/mcp/server.py"] } } } }
</details>
Windsurf
~/.windsurf/mcp_config.json
{
"mcpServers": { "workflow-generator": { "command": "python3", "args": ["~/.claude/skills/workflow-generator/mcp/server.py"] } } }
</details>
3. Restart your tool, then ask:
generate a workflow diagram for this project
how many concurrent requests can this handle? show me the system architecture
MCP tools exposed:
generate_workflow — scans project, writes WORKFLOW.html, optionally opens in browseranalyze_workflow — returns structured JSON summary (no file written)No install needed beyond Python 3.8+:
python3 ~/.claude/skills/workflow-generator/scripts/analyze.py . ~/WORKFLOW.html
Optional flags:
--access-log /path/to/access.log # overlay real request counts onto the dependency graph
--graph-detail auto|files|dirs # force file-level or directory-level graph nodes (default: auto)
Written: /your/project/WORKFLOW.html
Framework: FastAPI · Workers: 8 · Concurrent I/O: ~800 Practical throughput: ~50–200 req/min Bottleneck: OpenAI (LLM latency 3–30s per call) Gateway: nginx · 2 rate limit zone(s) LLM: OpenAI · eval: TruLens RAG Triad Storage: Qdrant, Redis External sources: Jira, Azure DevOps, Slack
workflow-generator/
├── SKILL.md ← Claude Code skill definition ├── INSTALL.md ← detailed per-platform install guide ├── workflow_generator_mcp/ │ ├── analyze.py ← core scanner + HTML renderer (stdlib only) │ └── server.py ← MCP stdio server (package form) ├── scripts/ │ └── analyze.py ← thin compatibility shim -> workflow_generator_mcp/analyze.py ├── tests/ ← pytest suite for the scanner ├── mcp/ │ ├── server.py ← MCP stdio server │ └── requirements.txt ← pip install mcp └── copilot/ ├── index.js ← GitHub Copilot Extension (Express) ├── package.json └── openai_function.json
MIT