Shadcn.io is not affiliated with official shadcn/ui
Chat Starred Messages
React chat block with starred and favorite messages for Next.js featuring star toggle on messages, yellow star indicators, starred messages panel, and filterable bookmarks using TypeScript, shadcn/ui, and Tailwind CSS
Bookmark important messages in your React and Next.js chat with starred message support. Each message has a star toggle that highlights it with a yellow star indicator. A dedicated panel slides open from the right listing all starred messages as compact cards with sender, date, and truncated content. Built with TypeScript, shadcn/ui Avatar, Badge, and Button components, and Tailwind CSS. Perfect for team channels, project discussions, meeting notes, and any chat where key information needs to be saved for later.
Related Components
Chat Pinned Messages
Pinned messages banner in chat
Chat Read Receipts
Message delivery and read status
Chat Mention Autocomplete
Chat with @mention autocomplete
Chat File Sharing
File attachment messages in chat
Chat Direct Message
One-on-one direct messaging
Chat Team Collaboration
Team collaboration chat interface
FAQ
Was this page helpful?
Sign in to leave feedback.
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
Startup Pitch
A startup pitch practice chat interface built with React, Next.js, shadcn/ui, and Tailwind CSS featuring slide cards, feedback scores, and investor Q&A simulation