[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-3694":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":17,"stars7d":18,"stars30d":19,"stars90d":16,"forks30d":16,"starsTrendScore":20,"compositeScore":21,"rankGlobal":10,"rankLanguage":10,"license":22,"archived":23,"fork":23,"defaultBranch":24,"hasWiki":25,"hasPages":25,"topics":26,"createdAt":10,"pushedAt":10,"updatedAt":31,"readmeContent":32,"aiSummary":33,"trendingCount":16,"starSnapshotCount":16,"syncStatus":34,"lastSyncTime":35,"discoverSource":36},3694,"openui","wandb\u002Fopenui","wandb","OpenUI let's you describe UI using your imagination, then see it rendered live.","https:\u002F\u002Fopenui.fly.dev",null,"TypeScript",22395,2063,147,65,0,3,37,107,23,44.94,"Apache License 2.0",false,"main",true,[27,28,29,30],"ai","generative-ai","html-css-javascript","tailwindcss","2026-06-12 02:00:52","# OpenUI\n\n\u003Cp align=\"center\">\n  \u003Cimg src=\".\u002Fassets\u002Fopenui.png\" width=\"150\" alt=\"OpenUI\" \u002F>\n\u003C\u002Fp>\n\nBuilding UI components can be a slog.  OpenUI aims to make the process fun, fast, and flexible.  It's also a tool we're using at [W&B](https:\u002F\u002Fwandb.com) to test and prototype our next generation tooling for building powerful applications on top of LLM's.\n\n## Overview\n\n![Demo](.\u002Fassets\u002Fdemo.gif)\n\nOpenUI let's you describe UI using your imagination, then see it rendered live.  You can ask for changes and convert HTML to React, Svelte, Web Components, etc.  It's like [v0](https:\u002F\u002Fv0.dev) but open source and not as polished :stuck_out_tongue_closed_eyes:.\n\n## Live Demo\n\n[Try the demo](https:\u002F\u002Fopenui.fly.dev)\n\n## Running Locally\n\nOpenUI supports [OpenAI](https:\u002F\u002Fplatform.openai.com\u002Fapi-keys), [Groq](https:\u002F\u002Fconsole.groq.com\u002Fkeys), and any model [LiteLLM](https:\u002F\u002Fdocs.litellm.ai\u002Fdocs\u002F) supports such as [Gemini](https:\u002F\u002Faistudio.google.com\u002Fapp\u002Fapikey) or [Anthropic (Claude)](https:\u002F\u002Fconsole.anthropic.com\u002Fsettings\u002Fkeys).  The following environment variables are optional, but need to be set in your environment for alternative models to work:\n\n- **OpenAI** `OPENAI_API_KEY`\n- **Groq** `GROQ_API_KEY`\n- **Gemini** `GEMINI_API_KEY`\n- **Anthropic** `ANTHROPIC_API_KEY`\n- **Cohere** `COHERE_API_KEY`\n- **Mistral** `MISTRAL_API_KEY`\n- **OpenAI Compatible** `OPENAI_COMPATIBLE_ENDPOINT` and `OPENAI_COMPATIBLE_API_KEY`\n\nFor example, if you're running a tool like [localai](https:\u002F\u002Flocalai.io\u002F) you can set `OPENAI_COMPATIBLE_ENDPOINT` and optionally `OPENAI_COMPATIBLE_API_KEY` to have the models available listed in the UI's model selector under LiteLLM.\n\n### Ollama\n\nYou can also use models available to [Ollama](https:\u002F\u002Follama.com).  [Install Ollama](https:\u002F\u002Follama.com\u002Fdownload) and pull a model like [Llava](https:\u002F\u002Follama.com\u002Flibrary\u002Fllava).  If Ollama is not running on http:\u002F\u002F127.0.0.1:11434, you can set the `OLLAMA_HOST` environment variable to the host and port of your Ollama instance.  For example when running in docker you'll need to point to http:\u002F\u002Fhost.docker.internal:11434 as shown below.\n\n### Docker (preferred)\n\nThe following command would forward the specified API keys from your shell environment and tell Docker to use the Ollama instance running on your machine.\n\n```bash\nexport ANTHROPIC_API_KEY=xxx\nexport OPENAI_API_KEY=xxx\ndocker run --rm --name openui -p 7878:7878 -e OPENAI_API_KEY -e ANTHROPIC_API_KEY -e OLLAMA_HOST=http:\u002F\u002Fhost.docker.internal:11434 ghcr.io\u002Fwandb\u002Fopenui\n```\n\nNow you can goto [http:\u002F\u002Flocalhost:7878](http:\u002F\u002Flocalhost:7878) and generate new UI's!\n\n### From Source \u002F Python\n\nAssuming you have git and [uv](https:\u002F\u002Fgithub.com\u002Fastral-sh\u002Fuv) installed:\n\n```bash\ngit clone https:\u002F\u002Fgithub.com\u002Fwandb\u002Fopenui\ncd openui\u002Fbackend\nuv sync --frozen --extra litellm\nsource .venv\u002Fbin\u002Factivate\n# Set API keys for any LLM's you want to use\nexport OPENAI_API_KEY=xxx\npython -m openui\n```\n\n## LiteLLM\n\n[LiteLLM](https:\u002F\u002Fdocs.litellm.ai\u002Fdocs\u002F) can be used to connect to basically any LLM service available.  We generate a config automatically based on your environment variables.  You can create your own [proxy config](https:\u002F\u002Flitellm.vercel.app\u002Fdocs\u002Fproxy\u002Fconfigs) to override this behavior.  We look for a custom config in the following locations:\n\n1. `litellm-config.yaml` in the current directory\n2. `\u002Fapp\u002Flitellm-config.yaml` when running in a docker container\n3. An arbitrary path specified by the `OPENUI_LITELLM_CONFIG` environment variable\n\nFor example to use a custom config in docker you can run:\n\n```bash\ndocker run -n openui -p 7878:7878 -v $(pwd)\u002Flitellm-config.yaml:\u002Fapp\u002Flitellm-config.yaml ghcr.io\u002Fwandb\u002Fopenui\n```\n\nTo use litellm from source you can run:\n\n```bash\npip install .[litellm]\nexport ANTHROPIC_API_KEY=xxx\nexport OPENAI_COMPATIBLE_ENDPOINT=http:\u002F\u002Flocalhost:8080\u002Fv1\npython -m openui --litellm\n```\n\n## Groq\n\nTo use the super fast [Groq](https:\u002F\u002Fgroq.com) models, set `GROQ_API_KEY` to your Groq api key which you can [find here](https:\u002F\u002Fconsole.groq.com\u002Fkeys).  To use one of the Groq models, click the settings icon in the nav bar.\n\n### Docker Compose\n\n> **DISCLAIMER:** This is likely going to be very slow.  If you have a GPU you may need to change the tag of the `ollama` container to one that supports it.  If you're running on a Mac, follow the instructions above and run Ollama natively to take advantage of the M1\u002FM2.\n\nFrom the root directory you can run:\n\n```bash\ndocker-compose up -d\ndocker exec -it openui-ollama-1 ollama pull llava\n```\n\nIf you have your OPENAI_API_KEY set in the environment already, just remove `=xxx` from the `OPENAI_API_KEY` line. You can also replace `llava` in the command above with your open source model of choice *([llava](https:\u002F\u002Follama.com\u002Flibrary\u002Fllava) is one of the only Ollama models that support images currently)*.  You should now be able to access OpenUI at [http:\u002F\u002Flocalhost:7878](http:\u002F\u002Flocalhost:7878).\n\n*If you make changes to the frontend or backend, you'll need to run `docker-compose build` to have them reflected in the service.*\n\n## Development\n\nA [dev container](https:\u002F\u002Fgithub.com\u002Fwandb\u002Fopenui\u002Fblob\u002Fmain\u002F.devcontainer\u002Fdevcontainer.json) is configured in this repository which is the quickest way to get started.\n\n### Codespace\n\n\u003Cimg src=\".\u002Fassets\u002Fcodespace.png\" alt=\"New with options...\" width=\"500\" \u002F>\n\nChoose more options when creating a Codespace, then select **New with options...**.  Select the US West region if you want a really fast boot time.  You'll also want to configure your OPENAI_API_KEY secret or just set it to `xxx` if you want to try Ollama *(you'll want at least 16GB of Ram)*.\n\nOnce inside the code space you can run the server in one terminal: `python -m openui --dev`.  Then in a new terminal:\n\n```bash\ncd \u002Fworkspaces\u002Fopenui\u002Ffrontend\nnpm run dev\n```\n\nThis should open another service on port 5173, that's the service you'll want to visit.  All changes to both the frontend and backend will automatically be reloaded and reflected in your browser.\n\n### Ollama\n\nThe codespace installs ollama automaticaly and downloads the `llava` model.  You can verify Ollama is running with `ollama list` if that fails, open a new terminal and run `ollama serve`.  In Codespaces we pull llava on boot so you should see it in the list.  You can select Ollama models from the settings gear icon in the upper left corner of the application.  Any models you pull i.e. `ollama pull llama` will show up in the settings modal.\n\n\u003Cimg src=\".\u002Fassets\u002Follama.png\" width=\"500\" alt=\"Select Ollama models\" \u002F>\n\n### Gitpod\n\nYou can easily use Open UI via Gitpod, preconfigured with Open AI.\n\n[![Open in Gitpod](https:\u002F\u002Fgitpod.io\u002Fbutton\u002Fopen-in-gitpod.svg)](https:\u002F\u002Fgitpod.io\u002F#https:\u002F\u002Fgithub.com\u002Fwandb\u002Fopenui)\n\nOn launch Open UI is automatically installed and launched.\n\nBefore you can use Gitpod:\n\n* Make sure you have a Gitpod account.\n* To use Open AI models set up the `OPENAI_API_KEY` environment variable in your Gitpod [User Account](https:\u002F\u002Fgitpod.io\u002Fuser\u002Fvariables). Set the scope to `wandb\u002Fopenui` (or your repo if you forked it).\n\n> NOTE: Other (local) models might also be used with a bigger Gitpod instance type. Required models are not preconfigured in Gitpod but can easily be added as documented above.\n\n### Resources\n\nSee the readmes in the [frontend](.\u002Ffrontend\u002FREADME.md) and [backend](.\u002Fbackend\u002FREADME.md) directories.\n","OpenUI 是一个利用想象力描述用户界面并实时渲染的工具。它支持通过自然语言生成和修改 UI 组件，并能将这些组件转换为 React、Svelte 或 Web Components 等多种前端框架代码，极大提高了开发效率与灵活性。基于 TypeScript 开发，兼容 OpenAI、Groq、Gemini 等多种 AI 模型服务，使得开发者能够轻松地在本地或云端运行该项目以快速原型化应用程序界面。特别适用于需要快速迭代设计概念或者希望探索新型交互方式的前端开发场景。",2,"2026-06-11 02:55:38","top_language"]