<div class="avatar avatar-xsm">
              <img class="img-round" src="../image/img_avatar.png" alt="avatar-sample-image"/>
              <i class="material-icons badge-xsm badge-yellow"> circle </i> 
         </div>
         <div class="avatar avatar-sm">
              <img class="img-round" src="../image/img_avatar.png" alt="avatar-sample-image"/>
              <i class="material-icons badge-sm badge-grey">circle</i>
         </div>
         <div class="avatar avatar-md">
              <img class="img-round" src="../image/img_avatar.png" alt="avatar-sample-image"/>
              <i class="material-icons badge-md badge-green">circle</i>
         </div>
         <div class="avatar avatar-lg">
              <img class="img-round" src="../image/img_avatar.png" alt="avatar-sample-image"/>
              <i class="material-icons badge-lg badge-red">circle</i>
         </div>