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.

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>
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.

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>
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

