OpenUI：用文字描述界面，实时看到成品

搭一个按钮、一张表单或一个设置面板，最耗时的常常是反复调间距、改 HTML 和 CSS。OpenUI 是机器学习平台 Weights & Biases（W&B）开源的界面生成工具：你用文字描述想要的界面，它立即渲染出来，还能继续用自然语言修改，例如「加一个深色模式」，最后把结果导出成 React、Svelte 或 Web Components 等框架的代码。W&B 自己也用它来测试和原型化面向大模型应用的新工具。仓库采用 Apache-2.0 协议，截至 2026-10-10 有 22,568 个 star。

核心功能

• 文字生成，实时预览：描述界面后马上渲染，看不对劲就直接说出修改要求，不必手动翻代码。
• 导出多种框架代码：README 说明可以把 HTML 转换为 React、Svelte、Web Components 等形式，减少从原型到项目的重写。
• 多家模型可选：支持 OpenAI、Groq、Gemini、Anthropic、Cohere 和 Mistral。通过 LiteLLM 还能接入更多模型，OpenAI 兼容的端点（如 LocalAI）同样可用。想要自定义路由时，可以在当前目录或容器的 /app 下放置 litellm-config.yaml，覆盖自动生成的配置。
• 本地模型：可以通过 Ollama 在本机运行模型，README 默认以 llava 为例，因为它是少数支持图片输入的 Ollama 模型之一。
• Docker 一键启动：官方镜像为 ghcr.io/wandb/openui，服务默认监听 7878 端口，把 API 密钥通过环境变量传进去即可。
• 开发环境齐全：仓库带 dev container，并给出 GitHub Codespaces 与 Gitpod 的配置，前后端可以热更新调试。

典型使用场景

• 全栈开发者：快速搭出管理后台的界面草图，先看效果，再决定哪些部分值得手写。
• 产品经理与设计师：把想法变成可以点击的 demo，在评审会上直接讨论交互，而不是对着文字描述猜。
• 隐私要求高的团队：用 Ollama 在内网运行本地模型，需求和代码都留在自己的机器上。README 也提醒，没有 GPU 时本地运行会很慢。

快速上手

README 推荐的 Docker 方式如下，把 xxx 换成你自己的密钥：

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

启动后访问 http://localhost:7878，输入一句界面描述就能看到第一版。如果只想先试试，官方演示站 openui.fly.dev 可以直接打开。

小结

适合想快速验证界面方案、又希望保留代码主动权的开发者和产品团队。界面风格的判断，可以配合 frontend-design 这个 Skill 一起用。仓库以 Apache-2.0 协议开源，主要语言是 TypeScript，最近一次推送在 2026-10-09。

几点需要先想清楚：

• 作者在 README 里坦言，它「不如 v0 那样打磨」。生成的界面更适合做原型，不适合直接上线。
• 云端模型需要自己的 API 密钥并按量付费；想完全离线就得自己准备能力足够的本地模型，硬件门槛不低。
• 生成的代码需要人工审查，尤其是交互逻辑和数据处理部分，README 中没有对这些方面做承诺。