{"id":47656511,"url":"https://github.com/thesysdev/openui","last_synced_at":"2026-04-04T00:00:56.103Z","repository":{"id":276164130,"uuid":"897268988","full_name":"thesysdev/openui","owner":"thesysdev","description":"The Open Standard for Generative UI","archived":false,"fork":false,"pushed_at":"2026-04-03T12:20:04.000Z","size":110102,"stargazers_count":3109,"open_issues_count":41,"forks_count":195,"subscribers_count":15,"default_branch":"main","last_synced_at":"2026-04-03T13:43:49.709Z","etag":null,"topics":["agent","agents","ai","generative-ui","help-wanted","javascript","llm","looking-for-contributors"],"latest_commit_sha":null,"homepage":"https://www.openui.com","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/thesysdev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2024-12-02T10:40:06.000Z","updated_at":"2026-04-03T11:41:42.000Z","dependencies_parsed_at":"2025-03-05T13:25:18.874Z","dependency_job_id":"b7cd8954-5471-4930-be40-5744c5393a9b","html_url":"https://github.com/thesysdev/openui","commit_stats":null,"previous_names":["thesysdev/crayon"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/thesysdev/openui","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thesysdev%2Fopenui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thesysdev%2Fopenui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thesysdev%2Fopenui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thesysdev%2Fopenui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/thesysdev","download_url":"https://codeload.github.com/thesysdev/openui/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thesysdev%2Fopenui/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31382355,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-03T23:20:52.058Z","status":"ssl_error","status_checked_at":"2026-04-03T23:20:51.675Z","response_time":107,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["agent","agents","ai","generative-ui","help-wanted","javascript","llm","looking-for-contributors"],"created_at":"2026-04-02T09:00:41.420Z","updated_at":"2026-04-04T00:00:56.090Z","avatar_url":"https://github.com/thesysdev.png","language":"TypeScript","readme":"\u003cdiv align=\"center\"\u003e\n\n\u003cimg src=\"./assets/banner.png\" alt=\"OpenUI — The Open Standard for Generative UI\" width=\"100%\"\u003e\n\n# OpenUI — The Open Standard for Generative UI\n\n[![Build](https://github.com/thesysdev/openui/actions/workflows/build-js.yml/badge.svg)](https://github.com/thesysdev/openui/actions/workflows/build-js.yml)\n[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](./LICENSE)\n[![Discord](https://img.shields.io/badge/Discord-Chat-7289da?logo=discord\u0026logoColor=white)](https://discord.com/invite/Pbv5PsqUSv)\n\n\u003ca href=\"https://trendshift.io/repositories/22357\" target=\"_blank\"\u003e\u003cimg src=\"https://trendshift.io/api/badge/repositories/22357\" alt=\"thesysdev%2Fopenui | Trendshift\" style=\"width: 250px; height: 55px;\" width=\"250\" height=\"55\"/\u003e\u003c/a\u003e\n\n\u003c/div\u003e\n\n\nOpenUI is a full-stack Generative UI framework — a compact streaming-first language, a React runtime with built-in component libraries, and ready-to-use chat interfaces — that is up to 67% more token-efficient than JSON.\n\n\n\n---\n\n\n\n[Docs](https://openui.com) · [Playground](https://www.openui.com/playground) · [Sample Chat App](./examples/openui-chat) · [Discord](https://discord.com/invite/Pbv5PsqUSv) · [Contributing](./CONTRIBUTING.md) · [Code of Conduct](./CODE_OF_CONDUCT.md) · [Security](./SECURITY.md) · [License](./LICENSE)\n\n\n---\n\n## What is OpenUI\n\n\u003cdiv align=\"center\"\u003e\n\n\u003cimg src=\"./assets/demo.gif\" alt=\"OpenUI Demo\" width=\"100%\"\u003e\n\u003c/div\u003e\n\nAt 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.\n\n**Core capabilities:**\n\n- **OpenUI Lang** — A compact language for structured UI generation designed for streaming output.\n- **Built-in component libraries** — Charts, forms, tables, layouts, and more — ready to use or extend.\n- **Prompt generation from your component library** — Generate model instructions directly from the components you allow.\n- **Streaming renderer** — Parse and render model output progressively in React as tokens arrive.\n- **Chat and app surfaces** - Use the same foundation for assistants, copilots, and broader interactive product flows.\n\n\n## Quick Start\n\n```bash\nnpx @openuidev/cli@latest create --name genui-chat-app\ncd genui-chat-app\necho \"OPENAI_API_KEY=sk-your-key-here\" \u003e .env\nnpm run dev\n```\n\nThis 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.\n\nWhat this gives you:\n\n- **OpenUI Lang support** - Start with structured UI generation built into the app flow.\n- **Library-driven prompts** - Generate instructions from your allowed component set.\n- **Streaming support** - Update the UI progressively as output arrives.\n- **Working app foundation** - Start from a ready-to-run example instead of wiring everything manually.\n\n\n\n## How it works\n\nYour components define what the model can generate.\n\n```mermaid\nflowchart LR\n    A[\"Component Library\"] --\u003e B[\"System Prompt\"]\n    B --\u003e C[\"LLM\"]\n    C --\u003e D[\"OpenUI Lang Stream\"]\n    D --\u003e E[\"Renderer\"]\n    E --\u003e F[\"Live UI\"]\n```\n\n1. Define or reuse a component library.\n2. Generate a system prompt from that library.\n3. Send that prompt to your model.\n4. Stream OpenUI Lang output back to the client.\n5. Render the output progressively with Renderer.\n\nTry it yourself in the [Playground](https://www.openui.com/playground) — generate UI live with the default component library.\n\n## Packages\n\n| Package | Description |\n| :--- | :--- |\n| [`@openuidev/react-lang`](./packages/react-lang) | Core runtime — component definitions, parser, renderer, prompt generation |\n| [`@openuidev/react-headless`](./packages/react-headless) | Headless chat state, streaming adapters, message format converters |\n| [`@openuidev/react-ui`](./packages/react-ui) | Prebuilt chat layouts and two built-in component libraries |\n| [`@openuidev/cli`](./packages/openui-cli) | CLI for scaffolding apps and generating system prompts |\n\n```bash\nnpm install @openuidev/react-lang @openuidev/react-ui\n```\n\n## Why OpenUI Lang\n\nOpenUI Lang is designed for model-generated UI that needs to be both structured and streamable.\n\n- **Streaming output** — Emit UI incrementally as tokens arrive.\n- **Token efficiency** — Up to 67% fewer tokens than equivalent JSON (see [benchmarks](./benchmarks)).\n- **Controlled rendering** — Restrict output to the components you define and register.\n- **Typed component contracts** — Define component props and structure up front with Zod schemas.\n\n### Token efficiency benchmarks\n\nMeasured with `tiktoken` (GPT-5 encoder). OpenUI Lang vs two JSON-based streaming formats across seven UI scenarios:\n\n| Scenario           | Vercel JSON-Render | Thesys C1 JSON | OpenUI Lang |  vs Vercel |      vs C1 |\n| ------------------ | -----------------: | -------------: | ----------: | ---------: | ---------: |\n| simple-table       |                340 |            357 |         148 |     -56.5% |     -58.5% |\n| chart-with-data    |                520 |            516 |         231 |     -55.6% |     -55.2% |\n| contact-form       |                893 |            849 |         294 |     -67.1% |     -65.4% |\n| dashboard          |               2247 |           2261 |        1226 |     -45.4% |     -45.8% |\n| pricing-page       |               2487 |           2379 |        1195 |     -52.0% |     -49.8% |\n| settings-panel     |               1244 |           1205 |         540 |     -56.6% |     -55.2% |\n| e-commerce-product |               2449 |           2381 |        1166 |     -52.4% |     -51.0% |\n| **TOTAL**          |          **10180** |       **9948** |    **4800** | **-52.8%** | **-51.7%** |\n\nFull methodology and reproduction steps in [`benchmarks/`](./benchmarks).\n\n## Documentation\n\nDetailed documentation is available at [openui.com](https://openui.com).\n\n## Repository structure\n\n```\nopenui/\n├── packages/\n│   ├── react-lang/       # Core runtime (parser, renderer, prompt generation)\n│   ├── react-headless/   # Headless chat state \u0026 streaming adapters\n│   ├── react-ui/         # Prebuilt chat layouts \u0026 component libraries\n│   └── openui-cli/       # CLI for scaffolding \u0026 prompt generation\n├── skills/\n│   └── openui/           # Claude Code skill for AI-assisted development\n├── examples/\n│   └── openui-chat/      # Full working example app (Next.js)\n├── docs/                 # Documentation site (openui.com)\n└── benchmarks/           # Token efficiency benchmarks\n```\n\nGood places to start:\n\n- [openui.com](https://openui.com) for the full docs\n- [`examples/openui-chat`](./examples/openui-chat) for a working app\n- [`CONTRIBUTING.md`](./CONTRIBUTING.md) if you want to contribute\n\n## Community\n\n- [Discord](https://discord.com/invite/Pbv5PsqUSv) — Ask questions, share what you're building\n- [GitHub Issues](https://github.com/thesysdev/openui/issues) — Report bugs or request features\n\n\n## Contributing\n\nContributions are welcome. See [`CONTRIBUTING.md`](./CONTRIBUTING.md) for contribution guidelines and ways to get involved.\n\n## Agent Skill\n \nOpenUI ships an [Agent Skill](https://agentskills.io) so AI coding assistants (Claude Code, Codex, Cursor, Copilot, etc.) can help you scaffold, build, and debug Generative UI apps using OpenUI Lang.\n \n### Install\n \n```bash\n# With the skills CLI (works across all agents)\nnpx skills add thesysdev/openui --skill openui\n \n# Manual — copy into your project\ncp -r skills/openui .claude/skills/openui\n```\n \nThe skill covers component library design, OpenUI Lang syntax, system prompt generation, the Renderer, SDK packages, and debugging malformed LLM output.\n\n## License\n\nThis project is available under the terms described in [`LICENSE`](./LICENSE).\n","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthesysdev%2Fopenui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthesysdev%2Fopenui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthesysdev%2Fopenui/lists"}