open-intelligent-ui streams a component tree instead of markdown

The answer arrives as a program, not as text

The project describes itself as an open-source implementation of the Intelligent UI experience introduced in ChatGPT, built on OpenUI. The example that frames everything is a request such as plan a day in San Francisco, which in ChatGPT returns an interactive answer, a map, photographs and an editable itinerary, rather than text. The repository reproduces that experience with open source components so the same kind of interface can be built, modified and shipped inside any application. The mechanism is the key difference from a chatbot that emits markdown. The model streams OpenUI Lang 1.0, and the app renders it with a library of primitives that the model arranges itself, with no layout fixed in the components. There is a demo video showing ChatGPT's Intelligent UI on the left and this project on the right answering the same request, and a live demo is linked. The project states plainly that it is independent and is not affiliated with or endorsed by OpenAI, and that Intelligent UI refers to the ChatGPT feature the demo recreates.

The component library is the API surface

Because the model arranges primitives itself, the contents of that library determine what an answer can look like, and the README enumerates it in useful detail. Layout covers Col, Row, Box with background, radius, border, sizes and flex, Grid, Card, Carousel as a scrolling snapping row, Popover, Divider and Spacer. Text covers Title, Text with inline bold, italic, code and links, Caption, Label, Badge, Link, List and ListItem with bullets, numbers or a timeline, and Markdown. Inputs include Button, IconButton, Pressable, Input, TextArea, Select, SegmentedControl, Slider, Checkbox, RadioGroup, DatePicker, Timer as a countdown, and Form, and each input's first argument is its value, usually a variable other statements read. Media and data include SearchImage for a photo the app finds for a query, Image for a given URL, Icon with lucide names, Table whose cells may be components, Chart covering bar, line, area, pie, donut and scatter, Map with MapMarker built on MapLibre GL with category filter, expansion and a street route, and YouTube. The library lives in src/lib/library.ts with components in src/lib/components/, and it follows the Open Intelligent UI design with light and dark tokens, where only the gallery page and the benchmark preview switch to dark and the chat is light only.

Drawing, HTML and a function library for state

Beyond the standard components, the drawing primitives are what let an answer draw rather than describe. Svg comes with G, Circle, Ellipse, Rect, Line, Path, Polyline, Polygon and SvgText, and the attributes of those elements take expressions, so state can move them. HtmlView runs an HTML page, a game or a canvas, in a sandboxed iframe, which is how the demo covers something that looks like a working tool rather than a picture of one. The function library is the other half of the story. Alongside the 1.0 built-ins there are 59 generic functions in src/lib/functions/, so an answer can compute with its own state. They cover lists with Append, Remove, Update, Toggle, Includes, Range, Chunk and Shuffle, numbers with Pow, Random, Clamp, Percent, Allocate for splits that add up to the cent, Payment for loans and Convert for units, text with Format, Join, Split, Replace, Capitalize, Plural, Duration and Default, colours with MixColor, dates with Today, FormatDate, AddDays, AddMonths, DaysBetween, MonthsBetween and StartOf, and dashboard data with GroupBy, Pivot, Top, Between, Bucket, Cumulative, MovingAvg, Change, Histogram and Stats. A bad argument makes a call evaluate to null, as in 1.0. There is also a single action, CopyToClipboard, for copying a shopping list or a split.

Setup is four commands and a key

The setup requires Node 24, and the sequence is short:

cp .env.example .env
npm install
npm run generate:apiKey   # writes THESYS_API_KEY to .env
npm run dev

After that you open http://localhost:3000 and can try the prompt I'm in San Francisco for a day, plan a sightseeing route for me. The generate:apiKey script uses the OpenUI CLI to write a key into the environment file, and the key is described as an OpenUI Cloud, or Gateway, key, used only on the server. The rest of the environment is where the design choices live. THESYS_MODEL takes a provider and model id and defaults to openai/gpt-6.1-sol, and THESYS_BASE_URL is the gateway's Responses endpoint, defaulting to https://api.thesys.dev/v1/embed. LLM_REASONING_EFFORT applies to both paths and defaults to low, which the documentation describes as about five times faster to the first line of UI on that model at the same quality, with default sending none at all. There is also a development-only flag, NEXT_PUBLIC_OPENUI_DEVTOOLS, that shows the OpenUI devtools widget in the chat.

Run it against your own model instead of the cloud

The gateway is not mandatory, and the two escape hatches are documented in detail. Setting LLM_BASE_URL, LLM_API_KEY and LLM_MODEL skips OpenUI Cloud and calls a model directly, for example through OpenRouter:

LLM_BASE_URL=https://openrouter.ai/api/v1
LLM_API_KEY=sk-or-...
LLM_MODEL=openai/gpt-6.1-sol

The /api/chat route then builds the full OpenUI 1.0 system prompt on the server from the same library spec and prompt options, streams Chat Completions and relays the text as Responses events, so the browser side is unchanged. The documentation is careful about what is lost in that path, noting that output is rendered as written and that the cloud correction step is not there. The second option is a local model through Ollama or any OpenAI-compatible local server, set with MODEL_PROVIDER to ollama, OLLAMA_MODEL defaulting to qwen3.8:27b and OLLAMA_BASE_URL defaulting to http://localhost:11434/v1. The warning about context length is the important practical detail, since the OpenUI prompt for this app is about 8,000 tokens while Ollama's default window is 4,096, which silently cuts the prompt and produces broken output.

Editorial conclusion

Adopt open-intelligent-ui when you want a working reference implementation of generative interface streaming in a Next.js app, and when the OpenUI component vocabulary is acceptable to your product. Do not adopt it expecting an arbitrary interface, since the model composes from a fixed library of primitives and can only render what exists there. Verify first that the library covers the components your use case needs, that the state and action model fits how your application will bind data, and that you are comfortable depending on the OpenUI standard and its cloud gateway or a local model.

Frequently asked questions

Official sources

1. Issues
2. License: MIT
3. Project website
4. README
5. thesysdev/open-intelligent-ui on GitHub