design-to-code

UI Slicing：将界面参考图切片转换为像素级还原的前端代码

viesloxy/ui-slicing · Slice any UI reference image (Pinterest, Dribbble, screenshots) into pixel-perfect front-end code. Agent skill + toolkit: section analysis, design tokens, font matching, screenshot diffing, anti-AI-slop checklist. Live: https://viesloxy.github.io/ui-slicing/

该项目是一个兼容 Agent Skills 标准的技能与工具包，用于把 Pinterest、Dribbble 截图等 UI 参考图转成忠实还原的前端代码。它提供 6 步工作流：获取图片、分析调色板与分节、建立设计 token、逐节构建、截图差异比对并修复、交付单个自包含 index.html，并内置反 AI 套路的清单。脚本依赖 Pillow，支持多种聊天模型和编码代理。