The UX of ChatGPT in your React app 💬🚀
assistant-ui is an open source TypeScript/React library to build production-grade AI chat experiences fast.
- Handles streaming, auto-scrolling, accessibility, and real-time updates for you
assistant-ui is an open source TypeScript/React library to build production-grade AI chat experiences fast.
Run one of the following in your terminal:
npx assistant-ui create # new project
npx assistant-ui init # add to existing project
Build: composable primitives to create any chat UX (message list, input, thread, toolbar) and a polished shadcn/ui theme you can fully customize.
Ship: production-ready UX out of the box — streaming, auto-scroll, retries, attachments, markdown, code highlighting, and voice input (dictation) — plus keyboard shortcuts and accessibility by default.
Generate: render tool calls and JSON as components, collect human approvals inline, and enable safe frontend actions.
Integrate: works with AI SDK, LangGraph, Mastra, or custom backends; broad provider support; optional chat history and analytics via Assistant Cloud (single env var).
Assistant Cloud: managed chat persistence and analytics. Deploy with the Cloud Starter template; bring any model/provider.
AI SDK: integration with Vercel AI SDK; connect to any supported provider.
LangGraph: integration with LangGraph and LangGraph Cloud; connect via LangChain providers.
Mastra: integration with Mastra agents/workflows/RAG; model routing via Vercel AI SDK; optional Mastra Cloud.
Custom: use assistant-ui on top of your own backend/streaming protocol.
assistant-ui takes a Radix-style approach: instead of a single monolithic chat component, you compose primitives and bring your own styles. We provide a great starter config; you control everything else.
Sample customization to make a Perplexity lookalike:
assistant-ui is the most popular UI library for building AI chat.
Hundreds of companies and projects use assistant-ui to build in-app AI assistants, including <a href="https://langchain.com/?ref=assistant-ui"><img src="https://raw.githubusercontent.com/assistant-ui/assistant-ui/main/.github/assets/logos/LangChain.svg" height="16" alt="LangChain"></a>, <a href="https://athenaintelligence.ai/?ref=assistant-ui"><img src="https://raw.githubusercontent.com/assistant-ui/assistant-ui/main/.github/assets/logos/Athena-Intelligence.svg" height="16" alt="Athena Intelligence"></a>, <a href="https://browser-use.com/?ref=assistant-ui"><img src="https://raw.githubusercontent.com/assistant-ui/assistant-ui/main/.github/assets/logos/Browser-Use.svg" height="16" alt="Browser Use"></a>, <a href="https://stack-ai.com/?ref=assistant-ui"><img src="https://raw.githubusercontent.com/assistant-ui/assistant-ui/main/.github/assets/logos/Stack.svg" height="16" alt="Stack"></a>, <a href="https://inconvo.com/?ref=assistant-ui"><img src="https://raw.githubusercontent.com/assistant-ui/assistant-ui/main/.github/assets/logos/Inconvo.svg" height="16" alt="Inconvo"></a>, <a href="https://helicone.ai/?ref=assistant-ui"><img src="https://raw.githubusercontent.com/assistant-ui/assistant-ui/main/.github/assets/logos/helicone.svg" height="16" alt="Helicone"></a>, <a href="https://getgram.ai/?ref=assistant-ui"><img src="https://raw.githubusercontent.com/assistant-ui/assistant-ui/main/.github/assets/logos/gram.svg" height="16" alt="Gram"></a>, <a href="https://coreviz.io/?ref=assistant-ui"><img src="https://raw.githubusercontent.com/assistant-ui/assistant-ui/main/.github/assets/logos/Coreviz.svg" height="16" alt="Coreviz"></a>, and more.
Backed by Y Combinator. Building something with assistant-ui? We’d love to hear from you.
Standard MoltPulse indexed agent.