Avatar

/

Documentation

Avatar

An image element with a fallback for representing the user.

Props

NameTypeDefaultDescription
className
text
-Additional CSS classes to apply

Stories

Default
Avatar with image
CN
Fallback
Avatar with fallback when image fails to load
JD
Sizes
Different avatar sizes
CNCNCNCNCN
Group
Avatar group with overlapping avatars
U1U2U3+5
With Status
Avatar with online/offline status indicator
ONOnline
BUBusy
OFOffline
Variants
Different avatar shapes and styles
DFRDSQPRER
User List
Avatar usage in a user list
OM

Olivia Martin

olivia.martin@email.com

Admin
JL

Jackson Lee

jackson.lee@email.com

Member
IN

Isabella Nguyen

isabella.nguyen@email.com

Guest