Convert Snippet to Image

Preview:

  <figure class="avatar-presence-wrapper">
      <img src="images/avatar-image.jpg" alt="avatar" class="avatar avatar-xl" />
      <span class="status bottom-right-lg online"></span>
  </figure>
  <figure class="avatar-presence-wrapper">
      <img src="images/avatar-image.jpg" alt="avatar" class="avatar avatar-sm" />
      <span class="status bottom-right-sm online"></span>
  </figure>
  <figure class="avatar-presence-wrapper">
      <img src="images/avatar-image.jpg" alt="avatar" class="avatar avatar-xl" />
      <span class="status bottom-right-lg offline"></span>
  </figure>
  <figure class="avatar-presence-wrapper">
      <img src="images/avatar-image.jpg" alt="avatar" class="avatar avatar-sm" />
      <span class="status bottom-right-sm offline"></span>
  </figure>

Download PNG Download JPEG Download 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