Honeycomb

Avatar

An image element with a fallback for representing the user.

When To Use

  • To display a user profile image.
  • To show initials when no image is available.
  • To represent a user in a list or card.
Basic
Standard avatar with image and fallback text.
CN
Badge
Avatar with a status indicator dot.
CN
Badge with Icon
Badge containing an icon element.
CN
Avatar Group
Multiple avatars displayed together.
CNABCD
Avatar Group Count
Group with overflow count indicator.
CNAB
+3
Sizes
Three size variants: small, default, and large.
SMDFLG
Dropdown
Avatar triggering a dropdown menu.