Skip to main content
Vuetify0 v1.0 is here
Vuetify0 Logo
Theme
Mode
Palettes
Accessibility
Vuetify One
Sign in to Vuetify One

Access premium tools across the Vuetify ecosystem — Bin, Play, Studio, and more.

Not a subscriber? See what's included

Avatar API

Headless image component with automatic fallback to icon or text content.

Explore these related pages for additional context and usage patterns.

PageCategory
AvatarSemantic
AtomPrimitives
ImageSemantic
useImageSystem

Avatar.Root

Props

namespace

string | undefined

Namespace for dependency injection

Default: "v0:avatar"

value

unknown

Identifier when used inside Avatar.Group; harmless when standalone

disabled

boolean | undefined

Disables this avatar's contribution to group capacity math

Default: false

groupNamespace

string | undefined

Namespace of the parent Avatar.Group context

Default: "v0:avatar:group"

Slots

default

AvatarRootSlotProps

Avatar.Fallback

Props

namespace

string | undefined

Namespace for retrieving avatar context

Default: "v0:avatar"

Slots

default

AvatarFallbackSlotProps

Avatar.Group

Props

namespace

string | undefined

Namespace for dependency injection (must match Avatar.Root groupNamespace)

Default: "v0:avatar:group"

max

number | undefined

Upper bound on visible count; default Infinity

responsive

boolean | undefined

Opt-in width-responsive truncation via createOverflow

Default: false

priority

AvatarGroupPriority | undefined

Which side keeps items when truncated

Default: "start"

gap

number | undefined

Pixel gap between items; only meaningful when responsive

Default: 0

label

string | undefined

Accessible name for the group

ariaLabelledby

string | undefined

ID of element that labels this group

ariaDescribedby

string | undefined

ID of element that describes this group

Slots

default

AvatarGroupSlotProps

Avatar.Image

Props

src

string | undefined

Image source URL

alt

string | undefined

Accessible alt text.

priority

number | undefined

Priority for display order (higher = more preferred)

Default: 0

namespace

string | undefined

Namespace for retrieving avatar context

Default: "v0:avatar"

Events

load

[e: Event]

error

[e: Event]

Slots

default

AvatarImageSlotProps

Avatar.Indicator

Props

namespace

string | undefined

Namespace of the parent Avatar.Group context

Default: "v0:avatar:group"

Slots

default

AvatarIndicatorSlotProps
Was this page helpful?

© 2016-1970 Vuetify, LLC
Services
Ctrl+/