Shadcn.io is not affiliated with official shadcn/ui
Profile with Location
A React hover card showing detailed user profile with location join date icons and expanded bio in wider card layout built with shadcn/ui and Lucide React
Profile cards cramped into narrow spaces lose important context. This React hover card uses w-80 width showing full bio, location with MapPin icon, and join year with CalendarDays icon—all the context without navigation. Built with shadcn/ui HoverCard and Lucide React icons with larger avatar and username handle, it's perfect for professional networks, remote team directories, or platforms where location and tenure matter for trust and collaboration.
Profile with Location preview
Installation
Related Components
Simple Profile Hover Card
Basic narrow profile hover
Profile with Badge
Profile with status badge
Profile with Follow Button
Profile with action button
Stats Hover Card
Data metrics in hover card
Avatar Component
Profile picture with fallback
User Profile Card
Full profile card layout
FAQ
Was this page helpful?
Sign in to leave feedback.
Profile with Badge
A React hover card showing user profile with avatar in trigger badge for status and join date information built with shadcn/ui components
Profile with Stats
A React hover card showing user profile with avatar bio and grid of stats separated by divider built with shadcn/ui HoverCard and Separator components