openui

1. Project Overview

OpenUI is an open-source, LLM-powered application that lets developers describe a user interface in plain English and instantly see it rendered live in the browser, then export the result as clean HTML/CSS or framework-specific code (React, Svelte, Web Components, and more).

2. Background & Positioning

OpenUI was created by Weights & Biases (W&B) — a company best known for machine learning experiment tracking — as an internal prototype for exploring what next-generation, LLM-powered developer tooling could look like. It was released publicly to let the wider community experiment with the same idea: turning natural-language intent into working front-end code without hand-writing markup.

Conceptually, OpenUI sits in the same space as proprietary "text-to-UI" generators, but distinguishes itself by being fully open source under a permissive license, provider-agnostic (it is not locked to a single AI vendor), and self-hostable — teams can run it entirely on their own infrastructure, including with local models via Ollama, rather than depending on a closed, hosted service.

3. Feature Categories

• 🤖 LLM Provider Integrations — 9 supported backends — OpenAI, Anthropic Claude, Google Gemini, Groq, Mistral, Cohere, Ollama (local models), any OpenAI-compatible endpoint, and LiteLLM as a unifying proxy — lets teams pick a cloud vendor, a self-hosted local model, or mix several depending on cost, privacy, and latency needs.

• 🎨 Code Export Targets — 4+ output formats — raw HTML/CSS, React, Svelte, and Web Components — converts the generated markup into the framework a team already uses, so output can be pasted directly into an existing codebase.

• 🖥️ Live Preview & Iteration — chat-driven refinement, instant rendered preview, per-message history — lets a developer keep describing changes ("make the button larger", "switch to a dark theme") and watch the UI update in real time without touching code.

• 👁️ Vision-Assisted Refinement — screenshot-based feedback for vision-capable models — lets users attach a screenshot (e.g., of a design mock or a rendering bug) so the LLM can align the generated UI with a visual reference.

• 🐳 Deployment Options — 4 setup paths — prebuilt Docker image, Docker Compose (with bundled Ollama), source install via uv, and ready-made Dev Containers for GitHub Codespaces/Gitpod — covers everything from a one-line demo to a fully customized local development environment.

4. Key Highlights

• Natural-language-to-UI generation — describe a component or full layout in a sentence and get a rendered, editable result in seconds, eliminating the blank-canvas problem of starting a new UI from scratch.
• Provider-agnostic architecture — powered by LiteLLM under the hood, so switching from, say, OpenAI to a local Ollama model is a configuration change, not a code change.
• Multi-framework export — the same generated design can be converted to plain HTML, React, Svelte, or Web Components, reducing rework when a design needs to move into a specific tech stack.
• Local-first option via Ollama — teams with data-privacy or cost constraints can run the entire pipeline offline using local, open-weight models, including vision models like Llava for screenshot-based refinement.
• Conversational iteration loop — refinements happen through chat rather than manual CSS tweaking, which keeps the feedback loop fast for both technical and less-technical users.
• Zero-friction trial — a single docker run command with an API key is enough to have a working instance, and a public demo is available for evaluation before any local setup.

5. Use Cases by Role

• General developers — quickly scaffold UI components or prototype layouts from a plain-language description, then export directly to the framework used in the current project.
• Data/research scientists — build simple front-ends for internal tools, dashboards, or ML demo apps without deep front-end expertise, especially useful for teams already using W&B for experiment tracking.
• Project managers / product owners — turn a feature description or wireframe idea into a clickable, visual prototype in minutes to align stakeholders before engineering work begins.

6. Getting Started

Find what you need — read the main README and the component-specific docs in backend/README.md and the frontend README, or try the hosted demo before installing anything:

open https://openui.fly.dev

Install / integrate — the fastest path is the prebuilt Docker image:

docker run --rm --name openui -p 7878:7878 -e OPENAI_API_KEY ghcr.io/wandb/openui

Then visit http://localhost:7878. To run from source (requires git and uv):

git clone https://github.com/wandb/openui.git
cd openui/backend
uv sync --all-extras
export OPENAI_API_KEY=xxxx
uv run python -m openui --dev

Contribute — fork the repository, open a branch against main, and submit a pull request following the existing PR conventions:

git clone https://github.com/wandb/openui.git
cd openui
git checkout -b my-feature

Check open issues for good first tasks before starting new work.

7. Project Structure

openui/
├── backend/          # Python API server: LLM orchestration, LiteLLM config, HTML generation
│   └── README.md     # Backend-specific setup and environment variables
├── frontend/         # React-based web UI: chat interface, live preview, code export
├── .devcontainer/     # Preconfigured dev environments for Codespaces / Gitpod
└── docker-compose.yml # Compose setup bundling OpenUI with a local Ollama instance

Key files: backend/ contains the model-routing logic that turns a chat prompt into rendered markup; frontend/ renders the live preview and handles conversion to React/Svelte/Web Components; .devcontainer/ lets contributors get a working environment with one click.

8. Related Ecosystem

• Upstream dependencies: LiteLLM (unified LLM API proxy), Ollama (local model runtime), and the various cloud LLM APIs it integrates with (OpenAI, Anthropic, Google Gemini, Groq, Mistral, Cohere).
• Origin organization: built by Weights & Biases, whose experiment-tracking platform OpenUI was originally built to complement as an internal tooling prototype.
• Complementary tools: sits alongside other "prompt-to-UI" tools in the broader AI-assisted front-end development space, offering an open-source, self-hostable alternative to closed hosted generators.

9. License

OpenUI is released under the Apache License 2.0.

• ✅ Commercial use, modification, distribution, and private use are all permitted.
• ✅ You may sublicense and build proprietary products on top of it, provided license and copyright notices are preserved.
• ❌ The license provides no warranty and no liability coverage from the authors.
• ℹ️ Apache-2.0 includes an explicit patent grant from contributors, which many teams find preferable to less explicit permissive licenses for enterprise adoption.

10. FAQ

Q: Do I need every LLM provider API key to use OpenUI?
A: No. All provider keys are optional — you only need to set the key(s) for the provider(s) you intend to use, e.g. just OPENAI_API_KEY, or none at all if running fully local via Ollama.

Q: Can I use OpenUI without sending data to a cloud AI provider?
A: Yes. OpenUI can run entirely against local models through Ollama, including vision models, via the bundled docker-compose.yml setup.

Q: What frameworks can I export generated UI to?
A: Plain HTML/CSS, React, Svelte, and Web Components are all supported as export targets.

Q: Where do I try OpenUI before installing anything?
A: The public demo is available at openui.fly.dev.

Q: How do I customize which models OpenUI uses?
A: OpenUI auto-generates a LiteLLM configuration from your environment variables; you can also supply a custom config via the OPENUI_LITELLM_CONFIG path or by placing a config file in the working directory.

11. Quick Links

• Repository: github.com/wandb/openui
• Backend docs: backend/README.md
• Issues / contribution tracker: github.com/wandb/openui/issues
• Pull requests: github.com/wandb/openui/pulls
• Live demo: openui.fly.dev

12. Summary

OpenUI turns the tedious first step of front-end development — translating an idea into markup — into a conversational, near-instant process powered by any LLM the team chooses, cloud or local. It's most valuable for developers and product teams who want to prototype UI quickly, evaluate LLM-assisted design workflows, or run a fully self-hosted alternative to closed text-to-UI tools, all under a permissive open-source license.