Preview:
<div class="badge_wrapper">
  <img class="avatar avatar_large" src="../../../resources/avatar.jpg" alt="logo">
    <span class="badge badge_circle badge_primary position_absolute right-0 top-0 translate-m-lx-ry">4</span>
</div>
<div class="badge_wrapper">
  <img class="avatar avatar_large" src="../../../resources/avatar.jpg" alt="logo">
    <span class="badge badge_circle badge_primary position_absolute right-0 bottom-0 translate-m-lx-ly">4</span>
</div>
<div class="badge_wrapper">
  <img class="avatar avatar_normal" src="../../../resources/avatar.jpg" alt="">
    <span class="badge badge_circle badge_primary position_absolute right-0">4</span>
</div>
<div class="badge_wrapper">
  <img class="avatar avatar_small" src="../../../resources/avatar.jpg" alt="">
    <span class="badge badge_primary badge_small position_absolute right-0">4</span>
</div>    
</div>
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter