Avatar
A small image that represents a user, account, or entity, usually circular and used next to names or actions.
AM
JK
RP
SD
+4
EM
Avatars identify a person or account in a list, comment, or activity feed. They typically fall back to initials or a colored shape when an image is missing. Avatars often appear in a stacked group to show multiple participants. Most design systems give them fixed size variants (xs, sm, md, lg) and a circular default, though Material allows square avatars too.
Also called
profile pictureuser imageuserpic
When to use
- Identifying who wrote a comment or did an action
- Showing a list of collaborators or assignees
- Account menus and profile entry points
When not to use
- As a button without a tooltip — users won't know who it is
- When the user identity isn't relevant to the task
- At sizes too small to recognize a face or initials
Related
Source
Universal UI vernacular; Material Design, Radix UI, and most design systems ship an Avatar component with image, initials, and stacked-group variants.