来源：Jack Cui

大家好，今天继续聊聊科技圈发生的那些事。

一、screenshot-to-code

一款将屏幕截图转换成代码的开源工具。

通过截取屏幕图像，screenshot 工具可以识别出代码的页面布局，生成HTML、CSS、Javascript 等常用的代码，同时还能预览代码实现的效果。

透过这个功能，似乎就像是 screenshot 帮我们戴上一副透视眼镜。仅仅根据截图，我们就能透过图像，直接看到背后的代码结构。当然，这背后的工作仍然要交给 AI 。

我们尝试将 Taylor Swift 的 Instagram 个人主页截图下来，并将其上传给 screenshot。

可以看到， screenshot 在很短的时间内就生成了新代码，将 Taylor 的主页以很高的还原度“复制”了下来。

对于 NYTimes 的新闻， screenshot-to-code 也有不错的表现。

单看这两个示例，我们可以发现，抛开选用的图像，只谈页面布局的话，说不上是一模一样，但 screenshot 至少能给出相似且舒服的代码，实现类似的布局效果。

在项目的主页上，作者团队声明使用了以下的AI大模型：

• GPT4-Vision
• Claude 3 Sonnet
• DALL-E

工具主要使用 GPT4-Vision 生成代码，而 Claude 3 Sonnet 用于辅助（在某些输入情况下，它比 GPT4-Vision 性能更好），并使用 DALL-E 生成图像。

目前 screenshot-to-code 有两种使用方式。一种是在作者团队的网站上在线使用，需要付费。

地址：https://screenshottocode.com

另一种是本地部署。

项目地址：

https://github.com/abi/screenshot-to-code

除了上传截图生成代码外，工具同样支持输入网页URL在线获取截图。

还可以将网站的视频/录 屏