Jone

Avatar

A high-quality, unstyled React avatar component that is easy to customize.

An easily stylable avatar component.

LTLT

Anatomy

Import the component and assemble its parts:

Anatomy
import { Avatar } from '@base-ui/react/avatar';

<Avatar.Root>
  <Avatar.Image src="" />
  <Avatar.Fallback>LT</Avatar.Fallback>
</Avatar.Root>;

API reference

Image

NameTypeDefaultDescription
onLoadingStatusChangeOptional((status: ImageLoadingStatus) => void) | undefinedCallback fired when the loading status changes.

Fallback

NameTypeDefaultDescription
delayOptionalnumber | undefinedHow long to wait before showing the fallback. Specified in milliseconds.

On this page