Figma Context MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
作者による説明(英語の原文)
Photo or text to technical drawing, DXF and DWG, printable STL, 3D models and product renders.
この3つを1つのスコアにまとめることはしません。意見、測定、人気はそれぞれ別のものだからです。
このサーバーのやさしい解説はまだ書いていません。以下はレジストリから読み取った事実です。
使っているAIアプリを選んで、設定をコピーしてください。
TECHDRAWAI_API_KEY「秘密」と表示された値は、あなたのアカウントの鍵です。絶対に人に教えたり、チャットに貼り付けたりしないでください。
必要なもの
どのアプリを使っていますか?
上でアプリを選んでください。選んだアプリを覚えておくので、次からはボタンに「…にインストール」と表示されます。
Claude Desktop → Settings → Developer → Edit Config を開き、claude_desktop_config.json にこれを貼り付けます
{
"mcpServers": {
"techdrawai": {
"command": "npx",
"args": [
"-y",
"techdrawai-mcp"
],
"env": {
"TECHDRAWAI_API_KEY": "your-value"
}
}
}
}ターミナルでこれを実行します
claude mcp add techdrawai --env TECHDRAWAI_API_KEY=your-value -- npx -y techdrawai-mcp動かす前に、空欄の値を入力してください。
プロジェクトの .cursor/mcp.json、または ~/.cursor/mcp.json に貼り付けます
{
"mcpServers": {
"techdrawai": {
"command": "npx",
"args": [
"-y",
"techdrawai-mcp"
],
"env": {
"TECHDRAWAI_API_KEY": "your-value"
}
}
}
}ブラウザがアプリを開いてよいか確認し、そのあとアプリが設定を表示して確認を求めます。キーの値は空欄のままなので、自分で入力してください。
プロジェクトの .vscode/mcp.json に貼り付けます
{
"servers": {
"techdrawai": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"techdrawai-mcp"
],
"env": {
"TECHDRAWAI_API_KEY": "your-value"
}
}
}
}ブラウザがアプリを開いてよいか確認し、そのあとアプリが設定を表示して確認を求めます。キーの値は空欄のままなので、自分で入力してください。
これはパソコンで動くサーバーですが、ChatGPTがつなげるのはインターネット上のサーバーだけです。ほかのアプリを選んでください。
選んだアプリは、この端末のCookieに保存されます。アカウントは不要です。
この設定は、作者のレジストリ登録情報から作成しています。READMEと違う場合は、READMEに従ってください。
パソコンで動くサーバーです。インストールすると、ツール一覧がAIアプリに表示されます。
誰でも見られる情報をチェックしており、コードは読んでいません。当てはまらない項目は数に入れていません。 · 2026年11月6日にチェック
レジストリ名は、リポジトリを所有するGitHubアカウント MeltFlexDevs で確認済みです
このリポジトリはまだGitHubから読み取っていません
このリポジトリはまだGitHubから読み取っていません
これはパソコンで動くため、インターネット上のエンドポイントはありません
パソコンで動き、代わりにローカルの設定を使います
パソコンで動くサーバーです。ツール一覧を読み取れるのは、インターネット上のエンドポイントがある場合だけです
レジストリでこのカテゴリにある有効なすべてのサーバーと比較しています。スターは、公開者がリポジトリの所有者である場合だけ数えます。
当てはまる基本チェック1項目のうち1項目に合格しました。コードは読んでいません。キーやトークンを追加する前に、サーバーがどんなアクセスを求めているかを確認し、必要な権限だけを持つキーを使ってください。
入力が必要なもの:TECHDRAWAI_API_KEY
あなたのパソコンで動きます。必要なときにAIアプリが起動し、データは作者のサーバーを通りません(サーバー自体がオンラインサービスを呼び出す場合を除きます)。
GitHubリポジトリの最終更新は–、最新バージョン(0.4.0)がレジストリに届いたのは24 日前です。
Claude Desktop、Claude Code、Cursor、VS CodeなどのMCP対応アプリで使えます。パソコンにNode.jsも必要です。
同じカテゴリには:Figma Context MCP, Claude Real Video, Figma MCP Server
同じカテゴリで、ほかの作者が作ったサーバー。スターの多い順。
カードの見方:★ 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、画像、スクリプトは取り除いています。リンクはこのサイトの外へ移動します。
AI agent skills for turning a photograph of a physical part into engineering documentation with TechDraw AI. Draft a dimensioned 2D technical drawing, trace it into CAD-ready DXF and DWG, reconstruct the part as a 3D mesh, or render it as a finished product shot. Works with Claude Code, Claude Desktop, Cursor, Codex, VS Code, Windsurf and anything else that loads Markdown skills or speaks MCP.
Each user authenticates with their own TechDraw AI API key, and every generation is billed to their account credits. The skills call the public TechDraw AI API directly, so there is nothing extra to install and no CAD kernel to build.
One photograph, three outputs: a dimensioned drawing, CAD geometry, and a 3D model.
Pick one. Each method sets the skills up for your agent.
npx skills (recommended, cross-agent)npx skills add MeltFlexDevs/techdrawai-skills
gh skill install MeltFlexDevs/techdrawai-skills
Inside Claude Code:
/plugin marketplace add MeltFlexDevs/techdrawai-skills
/plugin install techdrawai@techdrawai
If you want the tools without the skills, add the MCP server directly:
claude mcp add techdrawai -- npx -y techdrawai-mcp
Configuration for Cursor, Claude Desktop, Codex, VS Code and Windsurf is on the MCP page.
Universal fallback:
git clone --depth 1 https://github.com/MeltFlexDevs/techdrawai-skills.git
cd techdrawai-skills ./setup
More options in INSTALL.md. Agent-driven install, to paste into your agent: INSTALL_FOR_AGENTS.md.
Programmatic access is part of the Studio plan. Once you are subscribed, the simplest way to sign in is the browser flow, which mints a key from your session and hands it back over loopback so you never copy or paste a secret:
npx -y techdrawai-mcp auth login
Or create one by hand at [techdrawai.com/app](https://techdrawai.com/app?view=settings) → Settings → API keys and export it:
export TECHDRAWAI_API_KEY="tda_sk_..."
The key is shown exactly once at creation. Only its SHA-256 is stored, so nobody can recover it afterwards, including us. An account may hold five live keys and revoking one takes effect on the next request.
| Skill | Invoke | What it covers |
|---|---|---|
techdrawai-drafting | /techdrawai:drafting | Photo or written description to dimensioned technical drawing. Drafting standard, sheet size, projection angle, drawing type, views, and the measurements that anchor the scale. |
techdrawai-cad | /techdrawai:cad | Everything downstream of the drawing: DXF and DWG at true size, printable STL, 3D reconstruction from a photo or a drawing, and product renders. |
| Tool | What it does | Cost |
|---|---|---|
generate_technical_drawing | Photo to a dimensioned, standards-compliant technical drawing | 5 credits |
text_to_technical_drawing | A written description with sizes to a dimensioned technical drawing, no photo | 5 credits |
image_to_dxf | Any image to real CAD contours as DXF, optionally DWG | Free |
image_to_stl | Flat artwork (logo, stencil, line drawing) extruded into a printable STL | Free |
render_product | Technical drawing to a photorealistic product render | 5 credits |
photo_to_3d | Photo to a textured 3D mesh, GLB plus FBX, OBJ, USDZ, STL | 80 credits |
drawing_to_3d | Technical drawing to a textured 3D mesh, one call and one charge | 80 credits |
identify_product | Name the object in a photo | Free |
check_credits | Balance, plan, and what each operation costs | Free |
Failed generations are refunded automatically, so an agent that retries a bad prompt does not quietly drain the balance.
Every tool writes its result to disk (./techdrawai-output/ unless you pass output_path) and returns the path rather than the bytes. A technical drawing is a megabyte-scale image, and pushing that through the protocol would burn the agent's context on something it usually just hands to the next tool.
You: Here is a bracket,
~/photos/bracket.jpg. It is 120 mm across. I need a DXF for the laser cutter.
[identify_product] → "steel wall bracket"
[generate_technical_drawing] product_name: "steel wall bracket" measurements: [{ value: "120", unit: "mm", position: "overall width" }] standard: ISO · paper_size: A3 · drawing_type: working → ./techdrawai-output/drawing-2026-07-27_15-04-11.png 5 credits
[image_to_dxf] width_mm: 120 → ./techdrawai-output/drawing-2026-07-27_15-04-11.dxf 34 contours, free
The DXF arrives at true size, so it goes straight to the cutter without rescaling. More patterns in COOKBOOK.md.
Without a real measurement the dimensions are the model's best estimate and are marked nominal. With even one, every other feature is scaled proportionally from it and the whole drawing becomes internally consistent and manufacturable. If a user has not given one, ask for it. It is the single biggest quality lever in the whole workflow.
The same package is a command-line tool when you run it with arguments instead of letting an agent speak MCP to it:
techdrawai draw -i bracket.jpg --measure 120:"overall width" --paper A3
techdrawai dxf -i drawing.png --width-mm 120 --dwg techdrawai model3d -i bracket.jpg --detail high
Full reference at techdrawai.com/cli.
MIT. See LICENSE.