<div class="avatar size-36">
    <img
      class="mask is-squircle"
      src="images/avatar/avatar-12.jpg"
      alt="avatar"
    />
  </div>

              

                
  <div class="avatar size-36">
    <img
      class="mask is-reuleaux-triangle"
      src="images/avatar/avatar-12.jpg"
      alt="avatar"
    />
  </div>

              

                
  <div class="avatar size-36">
    <img
      class="mask is-diamond"
      src="images/avatar/avatar-12.jpg"
      alt="avatar"
    />
  </div>

              

                
  <div class="avatar size-36">
    <img
      class="mask is-hexagon"
      src="images/avatar/avatar-12.jpg"
      alt="avatar"
    />
  </div>
  <div class="avatar size-36">
    <img
      class="mask is-hexagon-2"
      src="images/avatar/avatar-12.jpg"
      alt="avatar"
    />
  </div>

              

                
  <div class="avatar size-36">
    <img
      class="mask is-octagon"
      src="images/avatar/avatar-12.jpg"
      alt="avatar"
    />
  </div>

              

                
  <div class="avatar size-36">
    <img class="mask is-star" src="images/avatar/avatar-12.jpg" alt="avatar" />
  </div>
  <div class="avatar size-36">
    <img
      class="mask is-star-2"
      src="images/avatar/avatar-12.jpg"
      alt="avatar"
    />
  </div>

              

                
  <div class="avatar size-36">
    <img class="mask is-heart" src="images/avatar/avatar-12.jpg" alt="avatar" />
  </div>