Shadcn.io is not affiliated with official shadcn/ui
Chat Expense Split
React expense splitting chat interface for Next.js with payment cards, participant breakdowns, settlement status indicators, and balance summaries using TypeScript, shadcn/ui, and Tailwind CSS
Split expenses and settle up directly in a chat interface built with React and Next.js. Expense messages render as structured cards showing the total amount, who paid, a per-person breakdown with individual shares, and settlement status tracking. Each participant sees their balance and can mark their share as paid. Built with TypeScript, shadcn/ui Avatar, Badge, and Button components, Framer Motion entrance animations, and Tailwind CSS. Perfect for group trip planners, roommate expense trackers, and shared dining bill splitters.
Related Components
Payment Request Chat
Inline payment cards in conversation
Group Chat
Multi-participant group messaging
Poll Messages Chat
Interactive poll cards in chat
Event Invitation Chat
Event RSVP cards in chat
Team Collaboration Chat
Team workspace messaging interface
Direct Message Chat
Private one-on-one messaging
FAQ
Was this page helpful?
Sign in to leave feedback.
Event Invitation
React chat block with calendar event invitation cards for Next.js featuring RSVP buttons, attendee counts, date and location display, and response status using TypeScript, shadcn/ui, and Tailwind CSS
Family Organizer
Family organization chat interface built with React, Next.js, shadcn/ui, and Tailwind CSS. Features chore assignments, calendar events, shared shopping lists, and member avatars.