# assistant-ui

> Open-source TypeScript and React component library for building AI chat interfaces

assistant-ui provides modular React primitives and CLI scaffolding to integrate AI chat copilots into web applications. It handles streaming, markdown, and keyboard shortcuts while allowing developers to render generative UI from model tool calls. It integrates directly with the Vercel AI SDK, LangGraph, and custom backend streams.

Website: https://github.com/assistant-ui/assistant-ui

## What it is for

- Embed an in-app AI assistant into an existing React or Next.js web application
- Render tool calls and JSON responses as interactive React components inline
- Trigger frontend actions like navigation or modal popups directly from chat tool outputs
- Connect front-end chat threads to Vercel AI SDK or LangGraph backends

## Features

- Composable primitives including Thread, Message, Composer, and ActionBar
- Generative UI support for rendering tool calls into custom UI cards
- Built-in streaming, auto-scroll, attachments, retries, and markdown formatting
- CLI tool to scaffold new projects or inject shadcn-styled components
- Runtime adapters for Vercel AI SDK, LangGraph, and custom data streams
- Accessible, unstyled components compatible with Base UI and Radix UI

## Pricing

Open source. Free (MIT license); optional paid Assistant Cloud for managed thread storage and analytics

## Details

- Type: Web app
- Category: [Development](https://xiry.app/topics/development.md)
- Topic: [UI Components](https://xiry.app/topics/development/ui-components.md)
- Open source: yes
- Platforms: Code library
- For: React and Next.js developers building AI copilots and chat interfaces
- Alternative to: CopilotKit, Vercel AI SDK UI components
- Tags: react, nextjs, ai chat, copilot, shadcn, typescript, generative ui

## Why it was saved

- [@simonfarshid, 25 February 2025](https://x.com/simonfarshid/status/1894428864635703596): The demo shows a working AI copilot (balance Q&A, navigation, Change PIN action) added to a Next.js banking app in under 4 minutes — a concrete pattern for embedding agent-driven UI actions in a SaaS product.

## Related

- [shadcn/ui](https://xiry.app/resources/shadcn-ui-1902): Copy-paste React UI components built with Tailwind CSS and Radix primitives. (Website, Open source)
- [Efferd](https://xiry.app/resources/efferd): Pre-built, responsive shadcn/ui blocks and layouts for React applications (Web app, Freemium)
- [Motion](https://xiry.app/resources/motion): Open-source animation library for React, Vue, and vanilla JavaScript (Website, Freemium)
- [React Bits](https://xiry.app/resources/react-bits): Open-source animated and interactive React UI components and backgrounds (Website, Freemium)
- [21st.dev](https://xiry.app/resources/21st-dev): Curated directory of crafted React, Tailwind, and shadcn UI components. (Website, Freemium)
- [lucide-animated](https://xiry.app/resources/lucide-animated): Open-source animated React icons built with Lucide and Motion (Web app, Open source)

Updated 10 October 2026. Page: https://xiry.app/resources/assistant-ui

Make your own library: Xiry takes your saved reels, tweets, Reddit bookmarks and Watch Later videos, makes them searchable and pulls the useful stuff out, like this library. It's invite-only for now; join the waitlist at https://xiry.app/#waitlist.