👉 AVIF (AV1 Image File Format) é um padrão de compressão de imagens proposto pela Netflix que suporta SDR, HDR e WCG.

⚡️ Além de imagens estáticas e transparência, AVIF suporta imagens animadas, assim como GIF, APNG e WebP.

🧐 O suporte hoje é amplo: Chrome 85+, Edge 121+, Firefox 93+ e Safari 16+. Confira o status atualizado no Can I Use.

👇 Para começar a usar AVIF, é preciso converter imagens existentes (recomendo o Squoosh do Google, ou plugins como o sharp para Node.js, e equivalentes para o sistema de build do seu projeto).

💥 Em seguida, use a declaração HTML abaixo para entregar AVIF nos browsers que suportam, com fallback para WebP e formatos tradicionais:

<picture>
  <source srcset="imagem.avif" type="image/avif" />
  <source srcset="imagem.webp" type="image/webp" />
  <img src="imagem.jpg" alt="Descrição da Imagem" />
</picture>