Avatars

Example for opting different size of image classes.

Example

Avatar classes are applied to the image to scale images properly.

Result
HTML

<img class="avatar-xs rounded-circle" src="../../assets/img/100x100/img4.jpg" alt="Image Description">
<img class="avatar-sm rounded-circle" src="../../assets/img/100x100/img5.jpg" alt="Image Description">
<img class="avatar rounded-circle" src="../../assets/img/100x100/img6.jpg" alt="Image Description">
<img class="avatar-lg rounded-circle" src="../../assets/img/100x100/img7.jpg" alt="Image Description">
<img class="avatar-xl rounded-circle" src="../../assets/img/100x100/img8.jpg" alt="Image Description">

Important

Nova does not include all classes, but includes only used classes to reduce the size of CSS files. However, you can add more sizes by adding entries to the Sass variable via: assets/include/scss/base/avatar/..