太牛逼了,只需一张截图

loonggg

读完需要

2

分钟

速读仅需 1 分钟

我已经无法用语言来形容了,所以只能说牛逼。

给大家分享一个开源项目:Screenshot to Code

它的功能就是将网页屏幕截图直接转换为干净的代码。

说通俗点、简单点就是当你看到一个网页或者网站不错,你只需要截屏,然后这个开源项目可以根据截屏,直接变成一个网页代码。

该开源项目利用 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 框架。这提供了极大的灵活性,使得项目能够适应更广泛的开发场景。它可以帮助开发者和设计师快速从设计原型过渡到实际的代码实现,从而加速开发流程,提高生产效率。

开源项目地址:https://github.com/abi/screenshot-to-code

演示视频:

最后,给大家分享一个我创建的知识星球,专门研究 AI 各种应用场景和落地实践的星球,里面都是分享关于 AI 实际应用的一些干货。如何用 AI 做各种工作的玩法。

最近更新了一系列的玩法和应用场景,也更新了一些国内大模型的玩法。现在星球搞活动,立减 50 元,只需要 49,后期随着加入的人越多,价格可能上涨哈,早学早享受。

持续干货分享,绝对超值。

ec6c6c280c448191e25888508cc3d89d.jpeg

7a266d34eed14116ce436daf19d89bf4.jpeg

499aa58c1b3a1a166c62170bec421dcc.jpeg

点击下方公众号卡片,关注我

在公众号对话框,回复关键字 “1024”

有惊喜

532c7f9a918f68a78606b0acf5bcfced.png

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值