Shadcn.io is not affiliated with official shadcn/ui
Profile Card
Profile card skeleton with left-aligned avatar, bio text lines, and three stat counters for social profiles and user cards
Social profiles need more than names—bio and stats tell the story. This React skeleton profile uses shadcn/ui Skeleton with left-aligned header (size-16 avatar plus name), bio text lines, and border-t stats section with three centered columns. Built with flex-shrink-0 avatar and flex-1 stat columns, the pattern shows complete social profile structure—perfect for social media profiles, team member cards, contact cards with stats, user directories, GitHub-style profiles, or any interface where bio text and stat counters define user identity during loading states.
Profile Card preview
Installation
Related Components
User Profile Header
Centered profile with buttons
Profile with Stats
Centered profile with stats
Card with Avatar
Avatar card with content
List with Avatars
Avatar list items
Badge
Real badge component
Avatar
Real avatar component
FAQ
Was this page helpful?
Sign in to leave feedback.