ai-elements
Pre-built React components for AI chat and agent interfaces
All Skills in This Repository (1)
Pure Emerald Level IndicatorsFrequently Asked Questions
FAQPage SchemaHow to install AI Elements?▼
Run `npx skills add vercel/ai-elements --all -g -y` in your terminal to install this skill suite globally for your AI agent.
What is AI Elements used for?▼
It is a React component library built on shadcn/ui that provides pre-built UI pieces like conversations, messages, code blocks, and reasoning displays for AI chat applications.
How do I add AI Elements components to my Next.js project?▼
Run `npx ai-elements@latest` to install all components, or `npx ai-elements@latest add <component-name>` for a single one. Components are copied into your codebase for full customization.
Does AI Elements work with the Vercel AI SDK?▼
Yes. It is designed to pair with the AI SDK's useChat hook and Tool types, so messages, tool calls, and agent configurations render correctly out of the box.
Do I need shadcn/ui to use AI Elements?▼
Yes. AI Elements builds on shadcn/ui and Tailwind CSS, but the CLI automatically sets up shadcn/ui if your project does not have it yet.
Related Repositories in Design & Creative
View All in Design & Creative→
nextlevelbuilderui-ux-pro-max-skill
AI design intelligence for professional UI, brands, and presentations
shadcn-uiui
Build and customize beautiful React component libraries with AI
nexu-ioopen-design
Open-source AI design studio for decks, prototypes, images, and video