Docs Components
Avatar & AvatarStackexperimental
A round ink coin with someone's initials. Stack a few, and you can see who's working here — that's the presence pattern.
API
| Prop | Type | Description |
|---|---|---|
name required | string | Full name; initials derive from the first two words. title + aria-label carry the full name. |
size | string | md = space-7, sm = space-6. |
AvatarStack.names required | string[] | Stack lists all names in its group aria-label; max (default 4) before +N. |
Design specifications
- fill
color-bg-inverse - text
color-text-inverse - font
type-label - ring
color-bg-surface (space-1/2) - overlap
-space-2
Guidelines
- mustAvatars are identity, not decoration — always carry the person's name for assistive tech.