Avatars in Bermuda

Bermuda offers the responsive range of avatars. The default avatar which you can use by simply applying avatar class to your image is of size 2rem X 2rem. Default sized avatar is showcased below.

default-avatar
                    
                       <img class="avatar" src="./assets/avatar.png" alt="default-avatar" />
                    
                

Sized Avatars

For different sized avatars we have different class names. Small avatar can be obtained by using the class name avatar-sm, for medium sized avatar you can use avatar-md and for large sized avatar you can use avatar-lg as a classname.

small-avatar medium-avatar large-avatar
                    
                        <img class="avatar-sm" src="./assets/avatar.png" alt="small-avatar" /> 

                        <img class="avatar-md" src="./assets/avatar.png" alt="medium-avatar" />

                        <img class="avatar-lg" src="./assets/avatar.png" alt="large-avatar" />
                    
                

Square Avatars

Square shaped avatars can be obtained using the additional classname to existing avatar classname. You can use avatar-square as an additional classname.

small-avatar medium-avatar large-avatar
                    
                        <img class="avatar-sm avatar-square" src="./assets/avatar.png" alt="small-square-avatar" /> 

                        <img class="avatar-md avatar-square" src="./assets/avatar.png" alt="medium-square-avatar" />

                      <img class="avatar-lg avatar-square" src="./assets/avatar.png" alt="large-square-avatar" />