Default

User Avatar
User Avatar
User Avatar
User Avatar
User Avatar
User Avatar

Sizing

User Avatar
User Avatar
User Avatar
User Avatar
User Avatar
User Avatar

Solid

A
B
C
D
E
F

Gradient

A
B
C
D
E
F

Soft

A
B
C
D
E
F

Shape

AB
EC
SQ
GR
VE
EF

Indicator

Avatar
Avatar
Avatar
Avatar

Group

User Avatar
User Avatar
User Avatar
User Avatar
User Avatar

Options

Reference Details
.avatar Initialize user avatar
.avatar-{size} Use {size} as: xs, sm, md, lg, xl,xxl
.bg-{color} Use avatar solid color {colors} from bg-colors
.bg-{color}-subtle Use avatar soft color {colors} from bg-colors-subtle.
.rounded-{shape} Use {shape} as: circle, rounded, 0. Default value is circle
.avatar-indicator {indicator} Use {indicator} as: active, busy, inactive
.avatar-group .avatar-group-{size} Use {size} as: xs, sm, md, lg, xl, xxl