Avatar
User representation components with clean, capsule-style aesthetics. Supports tray, capsule, and default variants with cold shadow styling.
Avatar Sizes
Multiple size options for different contexts.
XSSMDFLGXL2X
Avatar Variants
Different visual styles matching the tray design philosophy.
JD
Default
JD
Capsule
JD
Tray
Fallback Initials
When images are unavailable, display user initials.
JDAKMRSCTW
Avatar Stack
Overlapping avatars with hover interaction to highlight individual members.
U1U2U3U4+5
Status Indicators
Avatars with online/offline status badges.
ON
AW
OF
DN
User Card
Polished profile card with avatar and user details.
SC
Sarah Chen
Product Designer
Online
Team List
Polished team roster with interactive member rows.
Design Team
3 members
SC
LeadSarah Chen
JD
MemberJohn Doe
AK
MemberAlice Kim