plumb-mcp
活跃·★ 44·MIT·更新于 2026-05-28
★ 时下流行★ 视觉/多模态★ API 集成
Plumb 是一个带验证循环的 Figma 到代码 MCP 服务器，通过结构化设计规范和可视化差异对比确保生成的代码与设计一致。
Plumb 是一个带验证循环的 Figma 到代码 MCP 服务器。它通过桌面插件读取 Figma（无速率限制，Free 计划也可用），输出紧凑规范化设计规范（PDS）而非巨大 JSON tokens。独特的验证工具驱动无头 Chrome 对比渲染代码与原始设计，形成代码质量闭环。
#人工智能#ai-coding-agent#Anthropic#Claude Code#claude-mcp#Cursor#design-to-code#design-tokens
01
功能特性
01无速率限制：通过插件 API 读取 Figma，绕过 REST 配额和计划限制。
02紧凑规范（PDS）：去重设计标记并解析自动布局为 flexbox，减少 token 数量 1–2 个数量级。
03验证循环：`plumb_verify` MCP 工具和 CLI 比较渲染代码与 Figma 设计，输出结构化差异。
04十二个 MCP 工具：大纲、节点、标记、资源、截图、验证、搜索、组件等。
05两种数据路径：插件（无需 token，实时）和 REST（无头/CI，需要 token）。
02
兼容性
Claude Code
由 plumb-mcp init 自动检测
已通过文档验证
Cursor
由 plumb-mcp init 自动检测
已通过文档验证
VS Code
由 plumb-mcp init 自动检测
已通过文档验证
Windsurf
由 plumb-mcp init 自动检测
已通过文档验证
Any MCP-compatible agent
Stdio MCP 协议
已通过文档验证
03
快速开始
1
$ npm install -g plumb-mcp
2
$ plumb-mcp init
04
使用场景
↳编码代理（Claude Code、Cursor、Windsurf）根据 Figma 设计生成 UI，并通过验证确保像素级完美实现。
↳CI/CD 管道使用 `plumb-mcp verify` CLI 自动验证前端代码符合设计规范。
↳开发者需要从 Figma 提取结构化设计标记、SVG 图标和 PNG 资源，无速率限制或计划限制。
05
同类工具
相关搜索
评论
登录后发表评论
暂无评论，来发表第一条吧