Docs · Example App · Discord · Contributing · License
Build LLM-powered user interfaces with OpenUI Lang, streaming rendering, and generative UI.
OpenUI gives you a fast path from model output to structured, streamable UI in React.
OpenUI is an open source toolkit for building AI-native product interfaces in React.
At the center of OpenUI is OpenUI Lang: a compact, streaming-first language for model-generated UI. Instead of treating model output as only text, OpenUI lets you define components, generate prompt instructions from that component library, and render structured UI as the model streams.
Core capabilities:
- OpenUI Lang — A compact language for structured UI generation designed for streaming output.
- Built-in component libraries — Charts, forms, tables, layouts, and more — ready to use or extend.
- Prompt generation from your component library — Generate model instructions directly from the components you allow.
- Streaming renderer — Parse and render model output progressively in React as tokens arrive.
- Chat and app surfaces - Use the same foundation for assistants, copilots, and broader interactive product flows.
npx @openuidev/cli@latest create --name genui-chat-app
cd genui-chat-app
echo "OPENAI_API_KEY=sk-your-key-here" > .env
npm run devThis is the fastest way to start with OpenUI. The scaffolded app gives you an end-to-end starting point with streaming, built-in UI, and OpenUI Lang support.
What this gives you:
- OpenUI Lang support - Start with structured UI generation built into the app flow.
- Library-driven prompts - Generate instructions from your allowed component set.
- Streaming support - Update the UI progressively as output arrives.
- Working app foundation - Start from a ready-to-run example instead of wiring everything manually.
Detailed docs at openui.com ->
OpenUI turns your component library into a contract the model can target.
- Define or reuse a component library.
- Generate a system prompt from that library.
- Send that prompt to your model.
- Stream OpenUI Lang output back to the client.
- Render the structured output progressively with
<Renderer />.
This creates a direct path from model output to UI without relying on brittle text parsing or ad hoc JSON rendering layers.
| Package | Description |
|---|---|
@openuidev/react-lang |
Core runtime — component definitions, parser, renderer, prompt generation |
@openuidev/react-headless |
Headless chat state, streaming adapters, message format converters |
@openuidev/react-ui |
Prebuilt chat layouts and two built-in component libraries |
@openuidev/cli |
CLI for scaffolding apps and generating system prompts |
npm install @openuidev/react-lang @openuidev/react-uiOpenUI Lang is designed for model-generated UI that needs to be both structured and streamable.
- Streaming output — Emit UI incrementally as tokens arrive.
- Token efficiency — Up to 67% fewer tokens than equivalent JSON.
- Controlled rendering — Restrict output to the components you define and register.
- Typed component contracts — Define component props and structure up front with Zod schemas.
OpenUI is intended for more than demo chat windows. Use it to build:
- Assistants that render forms, charts, tables, and actions
- Embedded copilots inside existing products
- Full-page AI workflows
- Custom applications backed by your own model APIs
Detailed documentation is available at openui.com.
This repository contains the OpenUI monorepo, including the implementation, example app, and documentation source.
Good places to start:
- openui.com for the full docs
examples/openui-chatfor a working appCONTRIBUTING.mdif you want to contribute
Contributions are welcome. See CONTRIBUTING.md for contribution guidelines and ways to get involved.
This project is available under the terms described in LICENSE.