ScreenCoder

一款开源AI工具,能把任意设计截图一键转成结构清晰的HTML/CSS代码,支持多种大模型,适合快速原型和高保真还原。

coding 🆓 免费 🔓 开源
✨ 多智能体架构实现高保真还原✨ 支持多种主流大模型灵活切换✨ 生成代码即可直接用于生产✨ 开源免费,可本地化部署✨ 提供一键生成和分步执行两种模式
🌐 访问官网 →

产品概述

ScreenCoder 是一个基于多智能体架构的开源工具,能够将 UI 设计截图或设计稿自动转换为高质量、可编辑的 HTML/CSS 前端代码。它通过视觉理解、布局解析和代码生成技术,实现从设计图到可运行前端界面的无缝衔接,大幅提升开发效率。

核心优势

采用模块化多智能体设计,将截图转代码的复杂任务拆分为三个专业子任务:定位智能体负责用视觉语言模型检测 UI 关键组件;规划智能体根据前端最佳实践将组件组织成层级化布局树;生成智能体基于布局树和用户指令自适应生成代码。这种分工确保了输出代码在视觉布局和语义结构上均与原始设计高度一致,达到像素级还原。 同时,ScreenCoder 支持集成 Doubao、Qwen、GPT、Gemini 等多种主流大模型,用户可根据需求灵活选择生成引擎。生成的代码即用型强,可直接投入项目,且用户能够自由修改布局和样式,便于后续开发与定制。

适用场景