What is AVIF?
AVIF (AV1 Image File Format) is the use of the AV1 video codec, developed by the Alliance for Open Media, for still images. It supports wide colour gamut (HDR), 10/12-bit colour depth and transparency.
Comparison
| JPG | WebP | AVIF | |
|---|---|---|---|
| Compression efficiency | Baseline | Good | Very good |
| Transparency | No | Yes | Yes |
| Encoding speed | Fast | Fast | Slow |
| Browser support | Everywhere | All modern browsers | Current browsers |
When to use AVIF
AVIF gives clear savings on bandwidth-sensitive pages with high-resolution photos. The safe approach is to serve AVIF, WebP and JPG together with the <picture> element; the browser picks the first format it supports.
<picture>
<source srcset="photo.avif" type="image/avif">
<source srcset="photo.webp" type="image/webp">
<img src="photo.jpg" alt="Description" width="1200" height="800">
</picture>Converting
You can convert photos with JPG to AVIF or PNG to AVIF. AVIF encoding is CPU-heavy; with many large files it can take a few seconds each.