Identity
Avatar
One fixed box for a person or entity: image, derived initials, or icon — never a shifting layout.Anatomy
The public structure is divided into four responsibilities.
- 1
Root
Fixed square box that clips media to the selected shape and carries the accessible label.
- 2
Image
A native img using platform loading and decoding, covered and clipped to the box.
- 3
Initials
Up to two grapheme clusters derived from the name; visual only, never the announced name.
- 4
Icon
The explicit or default person icon when no initials can be derived.
Interactive configuration
Adjust size, shape, and variant, then switch the content preset to see the fallback pipeline.
Fallback is automatic
A failed source falls back without a retry loop; supply a new src to try again.
Initials are not a name
Assistive technology receives the full name, never the abbreviated letters.
States
States preserve accessibility and expected feedback.
Image
A valid source fills the box with cover behavior and emits load.
Fallback
A broken source emits error once and switches to initials or icon at the same size.
Initials
A name alone renders bounded initials without emitting a synthetic error.
Default icon
Without name or icon the person glyph renders and announces nothing.
In context
Avatars composed from public kit primitives, including an interactive wrapper.