Appearance
Avatar
An image element with a fallback for representing the user.
Examples
Default
CN
vue
<Avatar>
<AvatarImage src="https://github.com/radix-vue.png" alt="@radix-vue" />
<AvatarFallback>CN</AvatarFallback>
</Avatar>Props
AvatarImage
| Prop | Type | Default | Description |
|---|---|---|---|
| src | string | - | The source of the image. |
| alt | string | - | The alt text of the image. |
AvatarFallback
| Prop | Type | Default | Description |
|---|---|---|---|
| delayMs | number | - | Useful for delaying rendering so it only appears for those with slower connections. |
Slots
Avatar
| Slot | Description |
|---|---|
| default | The content of the avatar (Image and Fallback). |
AvatarFallback
| Slot | Description |
|---|---|
| default | The content of the fallback (e.g. initials). |