Orb Avatar

A generated identity mark — a soft disc of blended colour — for an agent or a person with no photo. OrbStack overlaps several into a group.

tsx

1import { OrbAvatar, OrbStack } from "@pestoui/core"

Hues

Five hues. The mark is decorative: put the name beside it rather than relying on the colour to identify anyone.

Size comes from className; the default is 24px. OrbStack takes the hues to show, in order.

Prop	Type	Default	Description
hue	"violet" \| "pink" \| "orange" \| "blue" \| "teal"	"violet"	On OrbAvatar. Which of the five discs to draw.
className	string	—	On OrbAvatar. Sets the size — size-6 unless overridden.
hues	OrbHue[]	all five	On OrbStack. One orb per entry, overlapped left to right.
orbClassName	string	—	On OrbStack. Applied to each orb — size-7 with a card-coloured ring unless overridden.
OrbStack className	string	—	On OrbStack. On the row that holds the orbs.

Pesto UI · 117 documented components