Avatar
Avatars are user profile pictures mainly used in social media sites & shopping sites. They basically are used for user identities.
Profile avatar
These is a the basic avatar variant which comes in round shape. Use .avatar class to create an avatar in your app.
<img class="avatar" src="url-of-the-image" alt="avatar-1">
Sizes Avatar
Avatars are available in 5 different sizes and these can be applied using the appropriate size suffix - .avatar-xs for extra small, .avatar-sm for small, .avatar-md for medium,.avatar-lg for large & .avatar-xxl for extra large.
<img class="avatar avatar-xs" src="url-of-the-image" alt="avatar-1">
<img class="avatar avatar-sm" src="url-of-the-image" alt="avatar-2">
<img class="avatar avatar-md" src="url-of-the-image" alt="avatar-3">
<img class="avatar avatar-lg" src="url-of-the-image" alt="avatar-4">
<img class="avatar avatar-xl" src="url-of-the-image" alt="avatar-5">
Square avatar
These are square shaped avatars with rounded edges. You can also customize these by giving an additional size class which was shown above.Use .avatar-square class to create a square variant.
<img class="avatar avatar-square" src="url-of-the-image" alt="avatar-1">