利用GPT-4 Vision视觉能力将截图转换成代码,支持HTML/Tailwind CSS、React、Bootstrap或Vue。
甚至还能使用DALL-E 3生成相似图片来直接填充生成的页面,让其看着很美观!
还可以直接输入任何网站的URL来直接克隆网站。
主要功能包括:
1、将屏幕截图转换为代码:用户可以上传屏幕截图,项目利用AI技术自动将其转换成干净的代码,支持HTML/Tailwind CSS、React、Bootstrap或Vue。
2、生成代码和图片:使用GPT-4 Vision来生成代码,以及DALL-E 3来生成视觉上相似的图片,提高生成代码的准确性和相关性。
3、克隆现有网站功能:用户可以通过输入一个网站的URL,项目将自动克隆该网站的布局和设计,转换成可编辑的代码。
4、支持从现有代码开始新项目:用户可以基于现有的代码开始一个新项目,这使得回访和迭代开发过程更加便捷,提高了项目的可持续发展能力。
5、提供编辑历史和分支功能:项目支持查看编辑历史和从这些历史记录中创建分支。这意味着用户可以方便地回溯到任何一个历史版本,并在此基础上探索不同的修改方向。
6、支持暗模式和输出Ionic代码:为了适应用户的偏好和需求,项目增加了界面的暗模式选择,并支持将屏幕截图转换成Ionic框架的代码。这为开发移动应用提供了更多的便利。
7、允许自定义技术栈:React、Bootstrap或TailwindCSS:用户可以根据个人或项目需求选择不同的技术栈,包括流行的前端框架和CSS框架。这提供了极大的灵活性,使得项目能够适应更广泛的开发场景。
它可以帮助开发者和设计师快速从设计原型过渡到实际的代码实现,从而加速开发流程,提高生产效率。
GitHub:https://github.com/abi/screenshot-to-code
![](https://macdown.net/wp-content/uploads/2024/03/tmp8fb41b6d3bf68c56fa31d6058a09a5d1.jpg)