AVIF is the next-generation image format that promises 50% smaller files than JPEG with better quality. But if you select AVIF as your output format and the file gets bigger instead of smaller — your browser doesn't actually support AVIF encoding.

What Is AVIF?

AVIF (AV1 Image File Format) is a modern image format based on the AV1 video codec. It was developed by the Alliance for Open Media (AOMedia) and offers truly impressive compression capabilities:

  • 50% smaller than JPEG at equivalent visual quality
  • 20% smaller than WebP at equivalent quality
  • Supports HDR (High Dynamic Range) content
  • Supports transparency (alpha channel)
  • Supports animation (replacing GIF)
  • Royalty-free and open-source

By all accounts, AVIF is the future of web images. However, there's an important distinction between decoding (viewing) and encoding (creating) AVIF images.

Decoding vs. Encoding: The Key Difference

Most modern browsers can display AVIF images just fine. Chrome, Firefox, Safari, and Edge all support AVIF decoding — meaning they can show AVIF images on web pages without any issues.

But encoding — actually creating an AVIF file from scratch — is a completely different story. This requires the browser to implement AVIF encoding in its Canvas API, which is computationally expensive and much harder to implement than decoding.

Browser AVIF Encoding Support (as of March 2026)

BrowserAVIF DecodingAVIF Encoding (canvas.toBlob)
Chrome 121+✅ Yes✅ Yes
Firefox✅ Yes❌ No
Safari✅ Yes❌ No
Edge✅ Yes✅ Yes (Chromium-based)
Mobile Chrome✅ Yes✅ Yes
Mobile Safari✅ Yes❌ No

What Actually Happens When Your Browser Doesn't Support AVIF Encoding

This is where things get interesting — and confusing. When you select AVIF as your output format but your browser can't encode AVIF, here's what happens:

The Silent Fallback

The Canvas API's canvas.toBlob(callback, 'image/avif', quality) method doesn't throw an error when AVIF encoding is not supported. Instead, it does something sneaky:

  1. It silently falls back to PNG format
  2. The resulting blob's MIME type becomes image/png instead of image/avif
  3. The file is saved with a .avif extension, but the actual content is PNG

This means your "AVIF" file is actually a PNG in disguise — and PNG is a lossless format that typically produces files 3-5x larger than the original JPEG. That's why your image appears to have grown 5x in size!

The Real-World Impact

Imagine this scenario: you upload a 500KB JPEG photo and select AVIF as the output format, expecting a ~250KB file. But instead:

  • Your browser silently outputs PNG → file becomes 2.5MB
  • The file extension says .avif but the content is PNG
  • Other tools may fail to open it because the extension doesn't match the content
  • You might think AVIF is a terrible format, when really your browser just doesn't support it

How We Detect AVIF Support

Image Zip proactively detects whether your browser supports AVIF encoding. We create a tiny 1×1 pixel canvas and attempt to encode it as AVIF:

canvas.toBlob(blob => {
  if (blob !== null && blob.type === 'image/avif') {
    // AVIF encoding is supported!
  } else {
    // Not supported — will show warning
  }
}, 'image/avif');

If the browser returns a blob with a different type (like image/png) or null, we know AVIF encoding isn't available, and we clearly show a "Browser not supported" warning on the format selector.

What About ICO Format?

ICO (icon) files have a similar issue. The Canvas API does not support ICO encoding at all — no browser implements it. When you select ICO as output, the browser falls back to PNG, resulting in a file with an .ico extension but PNG content.

For favicon purposes, modern browsers actually accept PNG files with a .ico extension, so this workaround often works. But it's not a true ICO file.

What Can You Do If Your Browser Doesn't Support AVIF?

Option 1: Use WebP Instead

WebP is supported by all modern browsers for both decoding and encoding. It provides 25-35% better compression than JPEG — not as good as AVIF's 50%, but still excellent and universally supported.

Option 2: Switch to a Chromium-Based Browser

If AVIF encoding is important to you, Chrome 121+ and Edge (Chromium-based) currently offer the best support. Both can encode AVIF via the Canvas API.

Option 3: Use Desktop Software

For professional AVIF encoding, dedicated desktop tools like squoosh (Google's own tool), libavif, or Photoshop with AVIF plugins provide reliable encoding regardless of browser support.

The Future of AVIF Browser Support

The good news is that AVIF encoding support is expanding. As the AV1 codec becomes more prevalent (driven by video streaming adoption), browser vendors are investing more in encoding support. We expect Firefox and Safari to add AVIF Canvas encoding in future updates.

Once all major browsers support AVIF encoding, browser-based tools like Image Zip will be able to deliver AVIF compression to everyone — providing the absolute best image optimization without any software installation.

Conclusion

AVIF is an incredible format, but browser encoding support is still catching up. If you see a "Browser not supported" warning when selecting AVIF, don't worry — it's not a bug, it's a limitation of your current browser. Use WebP as a reliable alternative, or switch to a Chromium-based browser for full AVIF encoding support.

Image Zip will always be transparent about what your browser can and can't do, so you never get unexpected results.

Try compressing your images now — we'll automatically detect what your browser supports.