时至今日，似乎还办法从 figma 设计图像素级的生成代码？这不应该是 AI 擅长领域吗？

2025 年 12 月 2 日
 liuliuliuliu
如题，我试了下 figma 的 mcp ，然后用 vscode+copilot 生成的代码也就是大体相似，一看细节，没有一处一样的，包括元素宽高啊，字体大小啊，完全不按照 figma 设计稿来

请问是不是我使用方法不对？请教下有没有人知道？
5301 次点击
所在节点    程序员
39 条回复
musi
2025 年 12 月 2 日
你从哪里看到的 AI 擅长还原设计稿
codehz
2025 年 12 月 2 日
vscode 的 copilot 也不支持多模态输入啊，那样从文本信息还原还能怎么精确呢
horizon
2025 年 12 月 2 日
同问
MENGKE
2025 年 12 月 2 日
AI 还原的质量，很大程度取决于给的 figma 设计稿图层的嵌套定位等是否符合规范
v2pm
2025 年 12 月 2 日
cursor+gemini pro+figma mcp 还原度还是很高的。
还有另外一个办法，就是把截图+SVG 格式的图像发给 AI 引用，像 gemini 这种多模态模型可以直接看图像来设计界面。
lzgshsj
2025 年 12 月 2 日
@codehz 亲测是支持的，截了一张网页截图，copilot 使用 claude opus 4.5 模型，Agent 模式。
它读出了图片上的内容，生成了 html 和 css ，把图片里的文字也还原了
bjzhou1990
2025 年 12 月 2 日
都不需要设计图，我直接把截图丢给 gemini3 做出来的效果都几乎一模一样，甚至功能都全了
zhengfan2016
2025 年 12 月 2 日
设计师：我就元素东拼西凑，我就 group 瞎命名🥴
visper
2025 年 12 月 2 日
正确的做法是，叫设计师不要去搞什么 figma,直接用 ai 来生成前端。
cfancc
2025 年 12 月 2 日
有没有可能是 copilot 太拉了
liuliuliuliu
2025 年 12 月 2 日
@v2pm 提示词有什么要注意的吗？我试了 gemini pro 效果也不理想
liuliuliuliu
2025 年 12 月 2 日
@bjzhou1990 真假？细节都一样吗？在 ai studio 还是在哪里？
liuliuliuliu
2025 年 12 月 2 日
@MENGKE
@zhengfan2016

设计师我们很难去控制啊……
liuliuliuliu
2025 年 12 月 2 日
@cfancc 我试了 gemini 也不太理想啊，我就想是不是我的提示词有问题，还是我操作不对
newtype0092
2025 年 12 月 2 日
你觉得的“大体相似”，在很多人眼里已经是“一模一样”了。

其实可以搞个 benchmark 来横评对比以下。
byuan04
2025 年 12 月 2 日
和设计稿规范度直接相关

比如一个元素看起来在一个容器内, 单实际他们是平级的, 都在另一个容器的左上角
这样对齐 居中 都要自己写 promtps 转换

另外更加别说一些 UI 效果是乱七八糟元素堆叠的....
byuan04
2025 年 12 月 2 日
另外不同设备上字体不同, 导致文本高度不同
用高度自适应, 元素之间位置就会重复叠加偏移量, 最终对不齐
用高度固定, 文字又会被截断.
设置本文不截断, 导致横向元素也会错位

其他还有太多太多问题了....
hubianluanma
2025 年 12 月 2 日
建议使用 Gemini3 试试，它在处理图片和前端的能力目前来看比较不错
sentinelK
2025 年 12 月 2 日
因为设计图的元素关系和 UI 代码结构不是一比一对应的。
网页与 native 应用的 UI 代码结构又不一样。

这就导致设计图和代码实现之间的统计学最优解不太明显。
gechang
2025 年 12 月 2 日
gemini3 或许可以，但是其他的都不行，我早就试过了

这是一个专为移动设备优化的页面（即为了让你能够在 Google 搜索结果里秒开这个页面），如果你希望参与 V2EX 社区的讨论，你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://v2ex.xtra.eu.org/t/1176321

V2EX 是创意工作者们的社区，是一个分享自己正在做的有趣事物、交流想法，可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX