Avatar

The circular identity mark: initials, a fallback glyph, any scale's tint.

Initials centered on a tinted circle; empty initials fall back to the person glyph. Color re-tints the pastel way from any scale.

Installation

Use the module import (the default), or own the source: lotusui add vendors the component into your app and lotusui update keeps the copy mergeable — see Registry.

go get github.com/ikaito-com/lotusui

# or vendor the source into your app:
go run github.com/ikaito-com/lotusui/cmd/lotusui add avatar

Usage

open demo ↗

lotusui.Avatar(th, lotusui.AvatarOpts{Initials: "AL"})
lotusui.Avatar(th, lotusui.AvatarOpts{Initials: "KB", Color: lotusui.Teal})

Sizes

open demo ↗

lotusui.Avatar(th, lotusui.AvatarOpts{Initials: "A", Size: lotusui.Size2XL})

Group

AvatarGroup overlaps right-over-left, each avatar ringed in the panel background.

open demo ↗

lotusui.AvatarGroup(th, lotusui.AvatarGroupOpts{},
	lotusui.AvatarOpts{Initials: "CN"},
	lotusui.AvatarOpts{Initials: "LR", Color: lotusui.Teal},
	lotusui.AvatarOpts{Initials: "ER", Color: lotusui.Pink},
)

Badge

Badge pins a status dot to the bottom-right rim — a color anchor, or an icon inside.

open demo ↗

lotusui.Avatar(th, lotusui.AvatarOpts{Initials: "CN",
	Badge: &lotusui.AvatarBadge{Color: lotusui.Green}})
lotusui.Avatar(th, lotusui.AvatarOpts{Initials: "PP",
	Badge: &lotusui.AvatarBadge{Icon: lotusui.IconPlus}})

Group with count

Count (or CountIcon) closes the group with a "+N" bubble.

open demo ↗

lotusui.AvatarGroup(th, lotusui.AvatarGroupOpts{Count: "+3"}, a1, a2, a3)

API

Option	Type	Description
`Initials`	`string`	Centered in the circle; empty falls back to the person glyph.
`Size`	`Size`	The shared size presets (Size2XS–Size2XL).
`Color`	`ColorScale`	Pastel re-tint from any scale.
`Scheme`	`*Scheme`	Wins over Color: full manual slot control.
`Badge`	`*AvatarBadge`	Status dot on the rim: Color anchors the fill, Icon renders inside.
`AvatarGroup(th, opts, avatars…)`	`widget`	Ringed overlap; Count/CountIcon add the trailing bubble.