目前看到网上的方案基本上都是先转到 figma 然后再用 MCP 转成前端代码，并且质量也不高。
所以我用了一周的时间做了个工具，能够自动裁剪和重绘 UI 设计图上的元素，高质量的把 UI 图转成前端代码。
可以直接看对比效果（一次直出没有任何调整）：
左侧是还原后的效果，右侧是 UI 图片。
操作非常简单，上传参考图片，然后看看有没有要调整的标注，没有直接点击“生成资产”就可以。
最后你可以把资源包发给 coding agent ，然后直接引用 prompt.md （资源包里自带）就可以直接转代码了。
开源地址： https://github.com/shouzi23333-rgb/AiClip
欢迎感兴趣的同学试试～
所以我用了一周的时间做了个工具，能够自动裁剪和重绘 UI 设计图上的元素，高质量的把 UI 图转成前端代码。
可以直接看对比效果（一次直出没有任何调整）：
左侧是还原后的效果，右侧是 UI 图片。
操作非常简单，上传参考图片，然后看看有没有要调整的标注，没有直接点击“生成资产”就可以。
最后你可以把资源包发给 coding agent ，然后直接引用 prompt.md （资源包里自带）就可以直接转代码了。
开源地址： https://github.com/shouzi23333-rgb/AiClip
欢迎感兴趣的同学试试～
Select Language