Avatar
A round user picture that falls back to initials on a stable hue.
Group: Media · Kind: native · in the lite catalog
Preview
Section titled “Preview”exampleJD
size · smJD
size · lgJD
Platforms
Section titled “Platforms”The same specimen painted by React, SwiftUI, Compose and gpui.




| Prop | Type | Required | Bindable | Description |
|---|---|---|---|---|
name |
string |
yes | yes | The person’s name; initials come from it. |
src |
url |
– | yes | The picture URL. |
size |
sm | default | lg |
– | – | Diameter class. Default "default". |
seed |
string |
– | – | Hashes the fallback hue; defaults to the name. |
Events
Section titled “Events”None.
None.
Children
Section titled “Children”none
A2UI basic mapping
Section titled “A2UI basic mapping”The basic catalog’s Image (avatar) renders as Avatar.
Built from
Section titled “Built from”A native component: every renderer paints it directly.
Accessibility
Section titled “Accessibility”Role: img
img (name)
Not focusable; no keys.
Theming
Section titled “Theming”Recipe parts: Avatar/root Avatar/image Avatar/fallback
Keyed by: size :hover :pressed :focus :disabled :checked :open :selected :invalid :dragover
Related
Section titled “Related”CallSurface · Image · ZoomableImage · Icon · Video · AudioPlayer · QrCode · Carousel