Avatar

Avatars are used to show profile images in headers or profile information sections. They can be in multiple sizes. xs — for extra small, sm — for small, md — for medium, lg — for large, and xl for — extra large.

Round Avatars with Images

Use the class .avatar-round to create circular avatars.

avatar 4
avatar 4
avatar 4
avatar 4
avatar 4


Square Avatars with Images

Use the class .avatar-sq to create square shaped avatars

avatar 5
avatar 5
avatar 5
avatar 5
avatar 5


Avatars with Letters

Avatars can also be just letters in case the user has not uploaded any images. The user can choose background color from any of the below available ones

C
LH
TA
JD


C
LH
TA
JD