$ loading_
将界面截图或 Figma 数据转为跨平台设计转代码产物,加速前端实现。
复制安装指令,让 AI 自动完成配置 · 推荐新手
"ui-design-to-code-mcp" 暂无可直接复制的安装信息,请查看页面文档或源码仓库。
请读取这张 UI 截图和对应的 Figma 节点 JSON,生成跨平台设计转代码产物,包括组件结构、样式映射、布局说明与实现建议。
输出可供前端开发使用的组件层级、样式标注、布局规则及代码实现参考。
基于 Figma 数据和页面截图的混合输入,分析视觉元素与结构对应关系,整理成统一的设计转代码中间产物,并指出可能缺失的信息。
输出统一的设计语义结构,并标注尺寸、间距、组件关系及待补充字段。
读取这个界面资源,生成适用于 Web 与移动端的设计转代码产物,重点说明可复用组件、响应式布局策略和平台差异处理建议。
得到面向多端开发的组件拆分方案、适配策略和实现优先级建议。
通过 Figma 插件 API 让 AI 直接创建、修改和管理设计稿。