Avatar
Display user profile images & fallbacks.
Installation
pnpm add @base-ui/reactExamples
Free, accessible React avatar components built with Base UI for user profiles, comments, and team lists with fallback initials.
Base
Status
Display online or offline indicators.
Verified
Include a verified badge for authenticated profiles.
Edit Profile
Display a tiny action button for editing profile pictures.
Icon Fallback
Show a fallback icon when no image or initials are available.
Initial Fallback
Generate a fallback using user initials.
SAJL
Detailed
Show additional user information alongside the avatar.
S
Sarah
@sarah
A
John
@john
J
Noah
@noah
Stacked
Group multiple avatars together in a horizontal stack.
SAJL+3
Stack Compact
Display a compact avatar group in a pill container.
SAJ+3
Sizes
Different sizes for all existing avatar variants.
S
A
J
L
R