Avatar ​

A visual representation of a user, typically shown as an image, initials, or an icon.

Themes ​

E
E

Controlled state ​

API Reference ​

Show types
typescript
export interface AvatarProps {
  /** Image URL used for the avatar */
  image?: string

  /** Fallback text shown when the image is missing */
  label?: string

  /** Controls the overall size of the avatar */
  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl'

  /** Defines the avatar shape */
  shape?: 'circle' | 'square'
}
Prop Default Type
image
—
string

Image URL used for the avatar

label
—
string

Fallback text shown when the image is missing

size
"md"
"md" | "xs" | "sm" | "lg" | "xl" | "2xl" | "3xl"

Controls the overall size of the avatar

shape
"circle"
"circle" | "square"

Defines the avatar shape

Slot Payload
default
—

Custom content shown inside the avatar (icon / initials replacement)

indicator
—

Small indicator shown at the bottom-right of the avatar

AlertBadge