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. 1

    Root

    Fixed square box that clips media to the selected shape and carries the accessible label.

  2. 2

    Image

    A native img using platform loading and decoding, covered and clipped to the box.

  3. 3

    Initials

    Up to two grapheme clusters derived from the name; visual only, never the announced name.

  4. 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.

Properties

Size

Shape

Variant

Content

Slots

States

States preserve accessibility and expected feedback.

Loaded

Image

A valid source fills the box with cover behavior and emits load.

Failed

Fallback

A broken source emits error once and switches to initials or icon at the same size.

No image

Initials

A name alone renders bounded initials without emitting a synthetic error.

Anonymous

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.