Does my browser support WebP and/or AVIF?

A quick check to see if your browser or application support the modern image formats WebP and AVIF.
Does my browser support WebP and/or AVIF?

WebP support

If your browser supports WebP the label on the image will indicate this and a green check will be shown. If the image label says WebP the browser supports the format, when the label says JPG the browser does not support and falls back on JPG. A red cross appears.

WebP browser check

Here is the simplified HTML  I use in this page. It requests a WebP image and has the JPG as fallback.

<picture>
      <source srcset="Amsterdam-WebP.webp" type="image/webp">
      <source srcset="Amsterdam-JPG.jpg" type="image/jpeg">
      <img src="Amsterdam-JPG.jpg" alt="Amsterdam" style="width:100%">
  </picture>
HTML code to check for WebP

AVIF support

If the browser supports AVIF the label on the image will indicate this and a green check will be shown. If the image label says AVIF the browser supports the format, when the label says JPG the browser does not support and falls back on JPG. A red cross appears.

AVIF browser check

Here is the simplified HTML  I use in this page. And again, it now requests an AVIF image and has the JPG as fallback.

  <picture>
    <source srcset="=Amsterdam-AVIF.avif" type="image/avif">
    <source srcset="=Amsterdam-JPG.jpg" type="image/jpeg">
    <img src="=Amsterdam-JPG.jpg" alt="Amsterdam" style="width:100%">
  </picture>
HTML code to check for AVIF

Files

In order to get this working on this blog page I uploaded the different formats as file. I leave them here visible on the page, you might want to downlaod and play around.

Read more

WebP and AVIF, the challengers of JPG
Check support for your own browser. The most common image formats are JPG and PNG . WebP is on the rise, a format strongly recommended by Google. The WebP (weppie) format is good at further compressing photos. AVIF, is much newer and actually a derivative of video formats. AVIF also produces
For images on the web stick with JPG and PNG. For now.
Want to keep it safe? Just go with the flow and choose JPG or PNG.