Figma Context MCP
Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.
ยังไม่มีคำอธิบายภาษาไทย ดูข้อเท็จจริงด้านล่าง หรือเปิดคำอธิบายต้นฉบับจากผู้ทำ
Local image tools via ImageMagick: metadata, resize, convert, crop, rotate.เลือกโปรแกรม AI ที่คุณใช้ แล้วคัดลอกค่าตั้งไปวาง
ผลตรวจผ่าน 3/3 · ทำงานบนเครื่องคุณ · ✓ ตรวจคำสั่งแล้ว 13 พ.ย. 2569
ขั้นแรก: คุณใช้ AI ตัวไหน
เลือกแอปที่คุณใช้ ขั้นตอนจะขึ้นด้านล่าง
ต่อกับ Claude ได้ แต่ต้องเตรียมก่อน
ต้องลง Node.js ในเครื่องก่อน (ทำครั้งเดียว) · ใช้ได้เฉพาะแอป Claude บนคอม (Windows หรือ Mac) ไม่ใช่บนเว็บหรือมือถือ
SettingsDeveloperEdit Config
{
"mcpServers": {
"imageport": {
"command": "npx",
"args": [
"-y",
"@reneturcios/imageport",
"mcp"
]
}
}
}ใช้ Imageport บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง✓ ถ้า Claude บอกว่ากำลังใช้ Imageport หรือมีชื่อเครื่องมือของ Imageport ขึ้นในคำตอบ แปลว่าต่อสำเร็จ
ชื่อเมนูตรวจกับหน้าช่วยเหลือของ Anthropic เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป
ChatGPT ยังต่อ Imageport ไม่ได้
Imageport ต้องติดตั้งในเครื่องคุณ แต่ ChatGPT ต่อได้เฉพาะตัวที่ทำงานบนเว็บ
ก · ใช้แอปที่ต่อ Imageport ได้
ข · ตัวอื่นในหมวด ออกแบบ ภาพ และเสียง ที่ต่อกับ ChatGPT ได้
เลือกจากตัวที่ใช้มากในหมวดเดียวกัน เฉพาะตัวที่ต่อด้วยที่อยู่ได้โดยไม่ต้องใส่คีย์
ต่อกับ Claude Code ได้ แต่ต้องเตรียมก่อน
ต้องลง Node.js ในเครื่องก่อน (ทำครั้งเดียว)
Mac: กด Command+Space พิมพ์ Terminal · Windows: เปิด PowerShell
claude mcp add --scope user imageport -- npx -y @reneturcios/imageport mcpต้องเห็น Imageport ในรายการและขึ้นว่าเชื่อมต่อแล้ว
ใช้ Imageport บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง✓ ถ้า Claude Code บอกว่ากำลังใช้ Imageport หรือมีชื่อเครื่องมือของ Imageport ขึ้นในคำตอบ แปลว่าต่อสำเร็จ
ชื่อเมนูตรวจกับหน้าช่วยเหลือของ Anthropic เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป
ต่อกับ Cursor ได้ แต่ต้องเตรียมก่อน
ต้องลง Node.js ในเครื่องก่อน (ทำครั้งเดียว)
ใช้ Imageport บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง✓ ถ้า Cursor บอกว่ากำลังใช้ Imageport หรือมีชื่อเครื่องมือของ Imageport ขึ้นในคำตอบ แปลว่าต่อสำเร็จ
ชื่อเมนูตรวจกับหน้าช่วยเหลือของ Cursor เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป
ต่อกับ VS Code ได้ แต่ต้องเตรียมก่อน
ต้องลง Node.js ในเครื่องก่อน (ทำครั้งเดียว)
ใช้ Imageport บอกหน่อยว่าทำอะไรให้ฉันได้บ้าง แล้วลองทำให้ดูหนึ่งอย่าง✓ ถ้า VS Code บอกว่ากำลังใช้ Imageport หรือมีชื่อเครื่องมือของ Imageport ขึ้นในคำตอบ แปลว่าต่อสำเร็จ
ชื่อเมนูตรวจกับหน้าช่วยเหลือของ VS Code เมื่อ 11 พ.ย. 2569 · หน้าจอของคุณอาจต่างเล็กน้อยตามรุ่นของแอป
Claude Code
claude mcp add --scope user imageport -- npx -y @reneturcios/imageport mcpClaude Desktop (claude_desktop_config.json)
{
"mcpServers": {
"imageport": {
"command": "npx",
"args": [
"-y",
"@reneturcios/imageport",
"mcp"
]
}
}
}Cursor (~/.cursor/mcp.json)
{
"mcpServers": {
"imageport": {
"command": "npx",
"args": [
"-y",
"@reneturcios/imageport",
"mcp"
]
}
}
}VS Code (mcp.json)
{
"servers": {
"imageport": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@reneturcios/imageport",
"mcp"
]
}
}
}ค่าตั้งนี้สร้างจากข้อมูลใน registry ของผู้ทำ ถ้าไม่ตรงกับ README ให้เชื่อ README
ดูจากแบบการต่อของ server ตัวนี้ และเอกสารของผู้ทำโปรแกรมแต่ละตัว ตรวจเมื่อ 10 พ.ย. 2569
ติดตั้งบนเครื่องได้ใน
ClaudeGooseLM StudioMsty StudioCherry StudioCursorVS Code + GitHub CopilotVisual StudioWindsurf (Devin Desktop)ZedKiroClineContinueJetBrains AI AssistantClaude CodeCodex CLIGemini CLIOpenCodenodecodeWarpLibreChatRaycast
รันในเครื่องคุณ รายการเครื่องมือจะขึ้นในแอป AI หลังติดตั้ง
เราตรวจจากข้อมูลที่ใครก็เปิดดูได้ ยังไม่ได้อ่านโค้ด ข้อที่ไม่เกี่ยวกับตัวนี้ไม่นับในตัวหาร · ตรวจเมื่อ 14 พ.ย. 2569
ชื่อใน registry ยืนยันด้วยบัญชี GitHub CloudCorpRecords ซึ่งเป็นเจ้าของ repo
มีการแก้โค้ดล่าสุด 12 วันที่ผ่านมา
ใช้ MIT
ตัวนี้รันบนเครื่องคุณ ไม่มี endpoint บนอินเทอร์เน็ต
ตัวนี้รันบนเครื่อง ใช้ค่าที่ตั้งในเครื่องแทน
รันในเครื่องคุณ เราอ่านรายการเครื่องมือได้เฉพาะตัวที่มี endpoint บนอินเทอร์เน็ต
ถาม แชร์เคล็ดลับ หรือแจ้งว่าใช้ไม่ได้ เรียงตามที่คนกดว่ามีประโยชน์
ยังไม่มีใครโพสต์ ถามหรือแชร์เป็นคนแรกได้เลย
ข้อความในส่วนนี้เขียนโดยผู้ใช้ ไม่ใช่ทีม PopNx
ยังไม่มีรีวิว
เทียบกับทุก server ที่ยังใช้งานในหมวดนี้ทั้งทะเบียน ดาวนับเฉพาะเมื่อผู้ลงทะเบียนเป็นเจ้าของ repo
จากการตรวจเบื้องต้นของเรา ผ่าน 3 จาก 3 ข้อที่ตรวจได้ เรายังไม่ได้อ่านโค้ด ก่อนใส่กุญแจหรือ token ให้ดูว่า server ขอสิทธิ์อะไร และเลือกกุญแจที่ทำได้เท่าที่จำเป็น
registry ไม่ได้ระบุว่าต้องใช้กุญแจ แต่บางตัวจะขอให้ล็อกอินตอนใช้ครั้งแรก
รันบนเครื่องของคุณ โปรแกรม AI จะเปิด server ขึ้นมาเองเมื่อใช้ ข้อมูลไม่ต้องผ่านเซิร์ฟเวอร์ของผู้ทำ (ยกเว้นตัวที่ไปเรียกบริการออนไลน์ต่อ)
repo บน GitHub มีการแก้โค้ดล่าสุด 12 วันที่ผ่านมา และส่งรุ่นล่าสุด (0.1.0) เข้า registry 12 วันที่ผ่านมา
โปรแกรมที่รองรับ MCP เช่น Claude Desktop, Claude Code, Cursor และ VS Code ตัวนี้ต้องมี Node.js, Docker ในเครื่องด้วย
ในหมวดเดียวกันมี 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 รูปภาพ และสคริปต์ออกแล้ว ลิงก์จะพาออกนอกเว็บ
imageport does local image work with ImageMagick. It reads an image file's metadata — format, dimensions, color space, file size — resizes an image while preserving its aspect ratio, converts between the common web and print formats (png, jpg, webp, gif, avif, bmp, tiff), crops a rectangle out of an image, and rotates by an angle in degrees. Every operation is plain local file processing: there is no image generation, no hosted AI, and no network call anywhere in this package.
All five tools build ImageMagick argument arrays and run them through one injectable executor. The default executor spawns convert and identify with node:child_process execFile — argument arrays, never a shell string — so a host needs ImageMagick installed. When the binaries are absent, the spawn error (for example ENOENT) is surfaced as the tool error, honestly; nothing is faked. The unit tests exercise the same core through a fake executor that records the argument arrays, so they need no ImageMagick at all.
One behaviour worth knowing up front: ImageMagick decides the output format from the output file's extension, so convert_image replaces the requested output path's extension with the target format whenever the two differ (converting photo.png to webp writes photo.webp), and the result reports that effective path.
npx -y @reneturcios/imageport mcp
Or run the container image (note: the container bundles no ImageMagick, so it passes MCP initialize / CLI usage smoke only — run on a host with ImageMagick installed for real work):
docker run -i ghcr.io/cloudcorprecords/imageport
imageport metadata <input>
imageport resize [--width n] [--height n] imageport convert imageport crop imageport rotate imageport mcp imageport --version
Examples:
imageport metadata photo.png
imageport resize photo.png photo-small.png --width 800 imageport convert photo.png photo-out.png webp # writes photo-out.webp imageport crop photo.png tile.png 200 200 40 60 imageport rotate photo.png photo-upright.png 90
Each command prints its result as JSON. Exit codes: 0 on success, 1 when ImageMagick fails (including when it is not installed), 2 for usage errors.
One bin serves both faces. The mcp subcommand starts a stdio MCP server:
npx -y @reneturcios/imageport mcp
MCP client configuration:
{
"mcpServers": { "imageport": { "command": "npx", "args": ["-y", "@reneturcios/imageport", "mcp"] } } }
| Tool | Input | What it does |
|---|---|---|
get_image_metadata | input (required) | Reads format, width, height, color space, and file size via identify. |
resize_image | input, output (required); width, height (at least one) | Resizes preserving aspect ratio via convert -resize. |
convert_image | input, output, format (required) | Converts to png, jpg, webp, gif, avif, bmp, or tiff; the output extension is replaced with the format when it differs. |
crop_image | input, output, width, height, x, y (required) | Crops a width x height region at offset x, y via convert -crop ... +repage. |
rotate_image | input, output, angle (required) | Rotates by angle degrees via convert -rotate. |
npm install
npm run build # tsc -> dist/ npm test # node test runner over test/*.test.ts, fake executor, no ImageMagick needed npm run dev # run the CLI from source via tsx
MIT — see LICENSE.