Figma Context MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
คำอธิบายจากผู้ทำ (ภาษาอังกฤษตามต้นฉบับ)
AI interior design — restyle rooms, place furniture, and virtually stage spaces from a photo.
สามเรื่องนี้ไม่รวมเป็นคะแนนเดียว เพราะความเห็น การวัด และความนิยม เป็นคนละเรื่องกัน
ตัวนี้ยังไม่ได้เรียบเรียงเป็นภาษาไทย ด้านล่างคือข้อเท็จจริงที่เราอ่านจาก registry
เลือกโปรแกรม AI ที่คุณใช้ แล้วคัดลอกค่าตั้งไปวาง
MELTFLEX_API_KEYค่าที่ติดป้ายความลับคือกุญแจของบัญชีคุณ อย่าส่งให้ใคร และอย่าวางในแชต
ต้องเตรียมก่อน
คุณใช้แอปไหน
เลือกแอปด้านบน เราจำไว้ให้ ครั้งหน้าปุ่มจะขึ้นว่า “ติดตั้งลง …”
เปิด Claude Desktop → Settings → Developer → Edit Config แล้ววางค่านี้ในไฟล์ claude_desktop_config.json
{
"mcpServers": {
"meltflex": {
"command": "npx",
"args": [
"-y",
"meltflex-mcp"
],
"env": {
"MELTFLEX_API_KEY": "ใส่ค่าของคุณ"
}
}
}
}พิมพ์คำสั่งนี้ใน Terminal
claude mcp add meltflex --env MELTFLEX_API_KEY='ใส่ค่าของคุณ' -- npx -y meltflex-mcpเติมค่าที่เว้นว่างไว้ก่อนรัน
วางในไฟล์ .cursor/mcp.json ของโปรเจกต์ หรือ ~/.cursor/mcp.json
{
"mcpServers": {
"meltflex": {
"command": "npx",
"args": [
"-y",
"meltflex-mcp"
],
"env": {
"MELTFLEX_API_KEY": "ใส่ค่าของคุณ"
}
}
}
}เบราว์เซอร์จะถามก่อนเปิดแอป จากนั้นแอปแสดงค่าตั้งให้ตรวจแล้วกดยืนยัน ช่อง key เว้นว่างไว้ให้คุณใส่เอง
วางในไฟล์ .vscode/mcp.json ของโปรเจกต์
{
"servers": {
"meltflex": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"meltflex-mcp"
],
"env": {
"MELTFLEX_API_KEY": "ใส่ค่าของคุณ"
}
}
}
}เบราว์เซอร์จะถามก่อนเปิดแอป จากนั้นแอปแสดงค่าตั้งให้ตรวจแล้วกดยืนยัน ช่อง key เว้นว่างไว้ให้คุณใส่เอง
ตัวนี้รันในเครื่องคุณ แต่ ChatGPT ต่อได้เฉพาะ server บนอินเทอร์เน็ต ลองเลือกแอปอื่น
ตัวเลือกเก็บในคุกกี้บนเครื่องนี้ ไม่ต้องมีบัญชี
ค่าตั้งนี้สร้างจากข้อมูลใน registry ของผู้ทำ ถ้าไม่ตรงกับ README ให้เชื่อ README
รันในเครื่องคุณ รายการเครื่องมือจะขึ้นในแอป AI หลังติดตั้ง
เราตรวจจากข้อมูลที่ใครก็เปิดดูได้ ยังไม่ได้อ่านโค้ด ข้อที่ไม่เกี่ยวกับตัวนี้ไม่นับในตัวหาร · ตรวจเมื่อ 6 พ.ย. 2569
ชื่อใน registry ยืนยันด้วยบัญชี GitHub MeltFlexDevs ซึ่งเป็นเจ้าของ repo
ยังไม่ได้อ่านข้อมูล repo จาก GitHub
ยังไม่ได้อ่านข้อมูล repo จาก GitHub
ตัวนี้รันบนเครื่องคุณ ไม่มี endpoint บนอินเทอร์เน็ต
ตัวนี้รันบนเครื่อง ใช้ค่าที่ตั้งในเครื่องแทน
รันในเครื่องคุณ เราอ่านรายการเครื่องมือได้เฉพาะตัวที่มี endpoint บนอินเทอร์เน็ต
เทียบกับทุก server ที่ยังใช้งานในหมวดนี้ทั้งทะเบียน ดาวนับเฉพาะเมื่อผู้ลงทะเบียนเป็นเจ้าของ repo
จากการตรวจเบื้องต้นของเรา ผ่าน 1 จาก 1 ข้อที่ตรวจได้ เรายังไม่ได้อ่านโค้ด ก่อนใส่กุญแจหรือ token ให้ดูว่า server ขอสิทธิ์อะไร และเลือกกุญแจที่ทำได้เท่าที่จำเป็น
ต้องใส่ค่าเหล่านี้: MELTFLEX_API_KEY
รันบนเครื่องของคุณ โปรแกรม AI จะเปิด server ขึ้นมาเองเมื่อใช้ ข้อมูลไม่ต้องผ่านเซิร์ฟเวอร์ของผู้ทำ (ยกเว้นตัวที่ไปเรียกบริการออนไลน์ต่อ)
repo บน GitHub มีการแก้โค้ดล่าสุด – และส่งรุ่นล่าสุด (0.2.1) เข้า registry 5 เดือนที่ผ่านมา
โปรแกรมที่รองรับ MCP เช่น Claude Desktop, Claude Code, Cursor และ VS Code ตัวนี้ต้องมี Node.js ในเครื่องด้วย
ในหมวดเดียวกันมี 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 รูปภาพ และสคริปต์ออกแล้ว ลิงก์จะพาออกนอกเว็บ
AI agent skills for photorealistic interior and exterior design and 3D via MeltFlex AI — restyle rooms, place real furniture, swap floors, walls, stairs, doors and windows, redesign kitchens, bathrooms, facades and gardens, and turn 3D drafts into photos, all from a single photo. Then go further: cinematic video walkthroughs, 2D floorplan → 3D model or rendered 3D picture, furniture photo → GLB 3D model, and photo → explorable 3D world. Works with Claude Code, Hermes, Cursor, Codex, Cline, and other AI agents that load Markdown-based skills or speak MCP.
Each user authenticates with their own MeltFlex API key; every generation is billed to their account credits. The skills call the public MeltFlex API directly, so there's nothing extra to install.
Interior redesign · floor restyle from a material · garden design — a few of the 16 image modes, all from one photo.
Furniture photo → 3D model · room render → explorable 3D world · 2D floorplan → 3D model. Real outputs of /api/v1/furniture-3d , /api/v1/world and /api/v1/floorplan-to-3d .
Pick one. Each method sets up the skills for your agent.
npx skills — recommended, cross-agentnpx skills add MeltFlexDevs/skills
gh skill install MeltFlexDevs/skills
Inside Claude Code:
/plugin marketplace add MeltFlexDevs/skills
/plugin install meltflex@meltflex
Universal fallback:
git clone --depth 1 https://github.com/MeltFlexDevs/skills.git
cd skills ./setup
More options in INSTALL.md. Agent-driven install (paste into your agent): INSTALL_FOR_AGENTS.md. Cline and other MCP-settings agents: llms-install.md.
You need an active subscription (any paid plan) — without one the key won't work. After subscribing at https://www.meltflexai.com/settings, open account settings → API Key under Profile, then Generate API Key (shown once — copy it):
Then expose it:
export MELTFLEX_API_KEY="mf_sk_xxxxxxxxxxxx"
If you use the MCP server / CLI, you can skip the copy-paste and sign in from the browser instead: npx -y meltflex-mcp auth login opens https://www.meltflexai.com/cli/authorize, mints a key from your signed-in session and stores it in ~/.meltflex/config.json (chmod 600).
| Skill | Invoke | Description |
|---|---|---|
| meltflex-design | /meltflex:design | Restyle a room, facade or garden; swap floors, walls, stairs, doors or windows; redesign a kitchen or bathroom; boost a layout; turn a 3D draft into a photo. 16 prompt-driven modes with quality levels, region editing and batches, plus video walkthroughs via the API. |
| meltflex-furniture | /meltflex:furniture | Place specific real furniture/decor products into a room photo, matching their exact colors, materials, and proportions (up to 10 reference items). |
| meltflex-3d | /meltflex:3d | 3D output: a furniture photo → GLB model, a 2D floorplan → GLB model or rendered 3D picture, a room photo → explorable 3D world (splat + hosted viewer). Handles the long-build polling. |
| meltflex-embed | /meltflex:embed | Put the design tool on your own website as an iframe: visitors design their room, or place your shop's products in it, without an account. Installs the code in HTML, React, Vue, Shopify or WordPress and fixes a blank frame. No API key. |
Image skills are self-contained: a room photo in, a photorealistic redesign out, 10 credits per image (auto-refunded on failure).
meltflex-design — 16 modes, each the same POST /api/v1/generate endpoint with a mode-tuned prompt:
| Mode | What it's for |
|---|---|
restyle | Change a room's style or theme |
virtual_staging | Furnish an empty room |
layout_boost | Rearrange existing furniture into a better layout |
declutter | Clean up / depersonalize a space |
exterior | Building facade / house exterior |
garden | Landscaping and outdoor design |
wall_texture | Change wall material or finish |
floor_restyle | Change the flooring |
stairs | Restyle a staircase in place |
doors | Swap interior doors |
windows | Swap window frames / glazing |
kitchen | Whole kitchen redesign |
bathroom | Whole bathroom redesign |
photo_to_render | Turn a 3D draft / SketchUp shot into a photo |
seasonal | Time-of-day / seasonal / lighting variation |
region_edit | Change only one area — paint it solid red, send mask: true |
Optional fields on every image call: resolution (512 / 1K / 2K), designLevel (lite −2 cr · quick · pro +5 cr), variations (1–3 per call, charged per image), up to 10 referenceImageUrls.
Same key, five more outputs. The three 3D builds can take minutes; they answer HTTP 202 + a poll URL when they outlive the request, and /meltflex:3d shows how to poll.
| Output | Endpoint | Credits | Time | MCP tool · CLI |
|---|---|---|---|---|
| Cinematic walkthrough video (MP4, Veo 3.1) | POST /api/v1/video | 100 (4s) / 150 (8s) | ~1 min | generate_video · meltflex video |
| Floorplan → rendered 3D picture (PNG) | POST /api/v1/floorplan-to-3d output: "render" | 10 | ~20 s | REST only |
| Floorplan → GLB 3D model | POST /api/v1/floorplan-to-3d output: "model" | 100 | ~3 min | floorplan_to_3d · meltflex floorplan |
| Furniture photo → GLB 3D model (+ USDZ/FBX/OBJ) | POST /api/v1/furniture-3d | 75 | 2–3 min | furniture_to_3d · meltflex furniture |
| Photo → explorable 3D world (.spz + viewer link) | POST /api/v1/world | 30 (draft) / 200 (hd) | ~1 / ~5 min | generate_world · meltflex world |
Full reference with response bodies and three.js / Spark loader snippets: https://www.meltflexai.com/api.
| What you want | Skill | Note |
|---|---|---|
| Restyle a room from a photo | meltflex-design | Pick a mode, write a specific prompt |
| Furnish an empty room | meltflex-design | virtual_staging mode |
| Place a *specific* sofa/bed/table | meltflex-furniture | Pass product images as references |
| Redesign a house exterior or garden | meltflex-design | exterior / garden mode |
| Swap flooring or wall finish | meltflex-design | floor_restyle / wall_texture (attach the material as a reference) |
| Restyle stairs, doors or windows | meltflex-design | stairs / doors / windows mode |
| Redesign a kitchen or bathroom | meltflex-design | kitchen / bathroom mode |
| Turn a 3D draft into a photo | meltflex-design | photo_to_render mode |
| Change only one marked area | meltflex-design | region_edit — paint it red, mask: true |
| Sharper output / several options | meltflex-design | resolution: "2K", designLevel: "pro", variations: 3 |
| Cinematic video walkthrough | meltflex-design | POST /api/v1/video (100–150 credits) |
| 3D model of a furniture piece | meltflex-3d | POST /api/v1/furniture-3d (75 credits) |
| 2D floorplan → 3D model / 3D picture | meltflex-3d | POST /api/v1/floorplan-to-3d (100 / 10 credits) |
| Walk through a room in 3D | meltflex-3d | POST /api/v1/world (30 draft / 200 hd) |
| Check credit balance | — | meltflex credits (CLI) or the MCP check_credits tool |
Live on the Kondela furniture shop: shoppers place its own products in a photo of their room, on the shop's own page.
No API key and no backend: build an embed in the Website Embed Builder (your domain, logo, colour, language, and for shops your product feed), then paste one iframe. Visitors design their room on your page without an account; each design uses 10 credits from your account. Any account gets the code and 10 free designs; after that it runs on an Enterprise plan.
<iframe
src="https://widget.meltflexai.com/YOUR_EMBED_ID" title="AI Interior Design by MeltFlex" width="100%" height="720" style="border:0;border-radius:12px;max-width:100%;" allow="clipboard-write" loading="lazy"
On a shop's product page, add ?product= and the tool opens with that product. /meltflex:embed installs the code in your project (HTML, React / Next.js, Vue, Shopify, WordPress), sets the frame-src rule if your site has a Content Security Policy, and walks through a blank frame. Guide: https://www.meltflexai.com/api#embed.
Agents that prefer tool calls over scripted API calls can run the meltflex-mcp server (npm, stdio). It exposes six tools — generate_interior, generate_video, floorplan_to_3d, furniture_to_3d, generate_world, check_credits — and handles polling and saving files to disk.
npx -y meltflex-mcp auth login # or: npx -y meltflex-mcp auth mf_sk_xxxxxxxx
claude mcp add meltflex -- npx -y meltflex-mcp
Any MCP client works with the same shape (command: npx, args: ["-y", "meltflex-mcp"], optional env.MELTFLEX_API_KEY). The same package is a terminal CLI: meltflex generate | video | floorplan | furniture | world | credits. A Claude Desktop extension bundle lives in mcpb/.
Hermes (Nous Research) speaks MCP, so it runs MeltFlex through the same server.
From the catalog (once merged into the Hermes catalog):
hermes mcp install meltflex
Manually — sign in once, then add the server to ~/.hermes/config.yaml:
npx -y meตัดมาแค่ช่วงต้น อ่านต่อใน repo