AI Elements

Collection of AI SDK UI components for building chat interfaces, including Message, Conversation, PromptInput, and more. See /ai-elements for detailed documentation.

For detailed AI Elements documentation, visit /ai-elements for individual component pages.

Import

Live Demo

AI SDK UI components preview.

Chat InterfaceWith Thread Sidebar
AI Assistant
Online
Can you help me analyze this data?
08:52 AM
I'd be happy to help you analyze your data! Please share the data file or paste the data you'd like me to look at. I can help with: • Statistical analysis • Data visualization suggestions • Pattern recognition • Insights and recommendations
08:53 AM
Here's a summary of our Q4 sales:
sales_q4.csv
08:54 AM
Thanks for sharing! Looking at your Q4 sales data, here are some key insights: **Top Performer:** Widget C with $67,500 revenue (39% of total) **Volume Leader:** Widget A with 1,200 units sold **Growth Opportunity:** Widget B has lower unit sales but good margins
08:55 AM
ChatMessage

Displays individual messages with support for:

  • User & assistant roles
  • Avatar display
  • Attachments
  • Loading states
  • Timestamps
MessageInput

Input area with features:

  • Auto-resizing textarea
  • Quick action buttons
  • Send on Enter
  • Loading state
  • Attachment support
ThreadList

Conversation management:

  • Thread navigation
  • Message counts
  • Last updated time
  • New thread creation
  • Active state indicator

Examples

AI Message

A single message in a conversation.

Conversation

A full conversation thread.