$ loading_
增强 Figma 设计上下文解析,帮助 AI 更准确理解布局并转换为代码。
复制安装指令,让 AI 自动完成配置 · 推荐新手
"Figma Context MCP" 暂无可直接复制的安装信息,请查看页面文档或源码仓库。
读取这个 Figma 文件中的页面和组件位置信息,分析各元素的层级、间距与对齐关系,并生成对应的响应式 HTML 和 CSS 代码。
输出基于设计结构的前端代码,并较准确还原布局与空间关系。
分析这个 Figma 画板中所有主要元素的位置关系,说明页面分区、组件排列方式,以及哪些区域使用了栅格、卡片或弹性布局。
输出一份清晰的布局说明,帮助团队快速理解设计结构。
根据 Figma 返回的元素位置和尺寸信息,对比现有页面实现,指出与设计稿在对齐、间距、层级和组件摆放上的差异,并给出修复建议。
输出设计与实现之间的差异清单及可执行的优化建议。
连接 Figma API 获取设计文件、节点信息与渲染图,辅助设计协作与开发实现。