Shadcn.io is not affiliated with official shadcn/ui
Chat Split Inbox
React split-panel inbox chat interface for Next.js with a conversation list, unread badges, active chat messages, and message input using TypeScript, shadcn/ui, and Tailwind CSS
A two-panel chat inbox for React and Next.js with a conversation list on the left and an active chat on the right. The left panel shows avatars, names, last message previews, and unread count badges. Click a conversation to load its messages in the right panel. Built with TypeScript, shadcn/ui Avatar, Badge, Button, and Input components, Tailwind CSS, and Framer Motion.
Related Components
Minimal Chat
Clean minimal one-on-one chat interface
Bubble Style Chat
Classic rounded bubble messages with pointer tails
Flat Messages Chat
Slack-style flat message layout without bubbles
Compact Dense Chat
Ultra-dense IRC/terminal style chat interface
Floating Widget Chat
Expandable floating chat widget overlay
Conversation List Chat
Inbox-style conversation list with previews
FAQ
Was this page helpful?
Sign in to leave feedback.
Social Media Scheduler
A social media scheduling chat interface built with React, Next.js, shadcn/ui, and Tailwind CSS featuring post previews, platform badges, and calendar integration
Sports Live
A live sports chat interface built with React, Next.js, shadcn/ui, and Tailwind CSS featuring score cards, play-by-play updates, and reaction emojis