Avatar
An image element with a fallback for representing the user, entity, or object in a concise visual format.
Usage
Avatars are used to represent people or entities across the platform. They are commonly found in profiles, lists of users, and navigation headers. Use an Avatar when you need to provide a quick visual identification of a user.
Content
Single Avatar
A standard avatar with an image and a fallback label.
CNALJD
Spec
- Border Radius: Fully rounded (circular) by default.
- Sizing: Default 40x40px, Small 32x32px, Large 64x64px.
- Colors: Falls back to Tertiary (#F5B53F) background for placeholder.
- Accessibility: Requires alt text for images; ARIA labels for fallbacks.
Anatomy
CN
Root container
Avatar image
Fallback (hidden)