Avatar

components/Images/Avatar.tsx

size

Sizes

sm (28px) / md (36px) / lg (46px) — fallback text from primaryGradient

PS
size="sm"
PS
size="md"
PS
size="lg"

fallback

Fallback text

Shows up to 2 chars of `fallback` — gradient background from theme

PS
"PS"
ZS
"ZS"
AB
"AB"
no fallback

src

With image src

Image covers the full circle — fallback shown if src fails to load

CA
valid src (sm)
CA
valid src (md)
CA
valid src (lg)
ER
broken src → fallback

real-world

Real-world usage

Inside a user row — avatar + name + role

ZS
ZeldaStreamer
Admin
PN
PurpleNova
Mod
GR
GhostRunner
Viewer