Avatar
A photo with a graceful fallback: initials on a flat tint whose hue is stable per name, or an icon. Groups overlap and fold into +N.
import { Avatar, AvatarGroup } from "pleate/avatar";Sizes, fallbacks, status, group
+2
Props
- src / name / alt
Photo, name for initials and color, accessible name.
string- size
Height, padding and type size.
"xs" | "sm" | "md" | "lg" | "xl" | "2xl"default "md"- shape
Circle or squircle-like rounded square.
"circle" | "rounded"default "circle"- status
Presence dot.
"online" | "away" | "busy" | "offline"- color / icon
Custom fallback color and glyph.
string / ReactNode- AvatarGroup max
Visible avatars before +N.
number