解放双手,前端界面再也不用自己写了?

随着 AI 技术的发展,现在有越来越多的尝试将 AI 应用于 UI 设计和开发中,以期提高效率和降低成本。

今天就给大家介绍一个开源的 AI 网页生成工具:OpenUI

OpenUI

OpenUI 是一个创新的开源项目,由 wandb 组织在 GitHub 上发起。该项目基于 LLM 实现将上传的截图或通过描述,自动生成前端界面的代码,支持代码实时预览以及将 HTML 转换成 React、Svelte 等功能,可选 GPT 3.5 和 GTP 4 等模型。

这一点类似于 v0,但 OpenUI 是完全开源的,并且在 Github 上拥有 18K star,可见其受欢迎程度。

图片

如何使用

图片

OpenUI 是完全开源的,感兴趣的小伙伴们可以自己下载源代码进行本地运行或者自行部署到 Docker 使用。

Docker部署

export ANTHROPIC_API_KEY=xxx
export OPENAI_API_KEY=xxx
docker run --rm --name openui -p 7878:7878 -e OPENAI_API_KEY -e ANTHROPIC_API_KEY -e OLLAMA_HOST=http://host.docker.internal:11434 ghcr.io/wandb/openui

源码安装

git clone https://github.com/wandb/openui
cd openui/backend
pip install .
export OPENAI_API_KEY=xxx
python -m openui

同时官方也提供了在线体验的地址:https://openui.fly.dev/ai/new

打开网站,我们会看到界面的下方有一个输入框

可以输入一些描述信息,比如输入:帮我生成一个后台管理系统,要求菜单中包含 首页、用户管理、权限管理、设置,右侧内容部分生成一个简单的表格。

图片

图片

可以去选择将 HTML 转换成 React、Svelte 等功能。

同时也可以直接上传效果图去生成。

图片

从效果图上来看还是不错的,可以代替我们一些简单的工作量,有兴趣的小伙伴可以试试。

Github:https://github.com/wandb/openui


相关文章

Gemini API已经发布,免费使用

Gemini API已经发布,免费使用

上周,Google 发布了一个新的多模态大模型 Gemini,从各项测试数据显示全面超越了 GPT4,在 AI 模型领域可谓赚足了风头。仅仅一周后,Gemini API 就发布了,并免费提供给开发者使...

不可思议!这款 Python 库竟然能自动生成GUI界面:MagicGUI

不可思议!这款 Python 库竟然能自动生成GUI界面:MagicGUI

大家好,今天我们来聊一聊一个非常有趣且实用的Python库——MagicGUI。这个库可以让你用最少的代码,快速创建图形用户界面(GUI)。如果你曾经尝试过用Tkinter、PyQt或其他GUI库开发...

Python GUI Maker:拖拽式生成Tkinter GUI 界面的设计工具,让Tkinter开发变得专业高效

Python GUI Maker:拖拽式生成Tkinter GUI 界面的设计工具,让Tkinter开发变得专业高效

简介Python 是一门极其流行和强大的编程语言,其简洁优雅的语法以及丰富的标准库和第三方库,使其在各个领域都广受欢迎。其中,Tkinter 是 Python 内置的图形用户界面(GUI)库,是构建...