AVIF Format Explained: Next-Gen Image Compression

AVIF (AV1 Image File Format) is the newest major image format to reach the web, and it offers the best compression of any widely supported format available today. Based on the AV1 video codec developed by the Alliance for Open Media, AVIF can produce files that are 30 to 50 percent smaller than JPG at similar visual quality, and it outperforms even WebP in most comparisons. As browser support has broadened in 2026, AVIF has moved from an experimental format to a production-ready option for performance-focused websites. This guide explains how AVIF works, what makes it different from other formats, its advantages and limitations, and how to start using it.

What Is AVIF?

AVIF is an image format that uses the AV1 video codec for image compression. AV1 was developed by the Alliance for Open Media (AOMedia), a consortium that includes Google, Mozilla, Cisco, Amazon, Netflix, Microsoft, and others, as a royalty-free, open-source video codec. AVIF applies the same compression technology to still images.

The format was introduced in 2019 and has been gaining browser support and adoption since then. By 2026, AVIF is supported by Chrome, Firefox, Safari, and Edge, covering the vast majority of web users. Its main appeal is compression efficiency: it produces smaller files than any other widely supported format at the same visual quality.

Key Features

• Best-in-class compression: 30 to 50 percent smaller than JPG at similar quality, and smaller than WebP in most comparisons.
• Lossy and lossless modes: Supports both, like WebP.
• High dynamic range (HDR): Supports 10-bit and 12-bit color depth, enabling over a billion colors and HDR content.
• Alpha transparency: Full support for transparency, like PNG and WebP.
• Animation: Supports animated images.
• Film grain synthesis: Can encode film grain separately from the image, preserving the look of film-originated content efficiently.
• Open and royalty-free: No patent licensing fees, unlike HEIC which is based on the licensed HEVC codec.

How AVIF Compression Works

AVIF uses the same underlying technology as the AV1 video codec, which is based on a combination of techniques including block-based prediction, transform coding, and entropy coding.

Block-Based Prediction

The image is divided into blocks (up to 128x128 pixels, larger than the blocks used by JPG or WebP). Each block is predicted from previously encoded blocks, using either intra prediction (from neighboring blocks in the same frame) or inter prediction (from other frames, for animation). The prediction can use many different modes to match the content of the block, which allows for very efficient encoding of common patterns like textures, gradients, and edges.

Transform and Quantization

After prediction, the difference between the prediction and the actual pixel values (the residual) is transformed using an integer approximation of the discrete cosine transform (DCT) or the asymmetric discrete sine transform (ADST). The transform coefficients are then quantized — rounded to a smaller set of values — which is where the lossy compression happens. The quantization step size controls the quality and file size.

Entropy Coding

The quantized coefficients are encoded using an arithmetic coder, which assigns shorter codes to more common values. This is more efficient than the Huffman coding used by JPG.

The combination of large block sizes, flexible prediction modes, and arithmetic coding is what gives AVIF its compression advantage. It can represent common image patterns more efficiently than older formats, producing smaller files at the same visual quality.

AVIF vs Other Formats

AVIF vs JPG

AVIF at the same visual quality as JPG is typically 30 to 50 percent smaller. At very low bitrates, AVIF also produces fewer visible artifacts — it tends to blur detail gracefully rather than introducing the blocky artifacts that JPG produces. AVIF additionally supports transparency, animation, and high dynamic range, none of which JPG supports.

JPG's advantage is universal support and fast encoding. Every application and device can read JPG, and encoding is nearly instantaneous. AVIF encoding is slower, which matters for bulk processing and real-time applications.

AVIF vs WebP

AVIF generally produces smaller files than WebP at the same quality, especially at low bitrates and for difficult content like dark scenes, smooth gradients, and high-frequency textures. The difference is typically 10 to 20 percent in AVIF's favor.

WebP's advantages are faster encoding and slightly broader support. WebP has been around longer and is supported by a few more tools and platforms. For most projects, using both — AVIF first, WebP as fallback — gives the best results.

AVIF vs HEIC

Both AVIF and HEIC are based on video codecs (AV1 and HEVC respectively) and offer similar features. AVIF's main advantage is that AV1 is royalty-free, while HEVC is subject to patent licensing fees that have limited its adoption on the web. AVIF also tends to produce slightly better compression than HEIC.

HEIC's advantage is native support on Apple devices — iPhones save photos as HEIC by default. However, for web use, AVIF is the better choice due to its open licensing and broader browser support.

Advantages of AVIF

Smallest File Sizes

For most content, AVIF produces the smallest files of any widely supported format. This directly translates to faster page loads, lower bandwidth costs, and better Core Web Vitals scores.

High Dynamic Range Support

AVIF's support for 10-bit and 12-bit color depth makes it suitable for HDR content, which is increasingly common as more displays support HDR. JPG and PNG are limited to 8-bit color.

Excellent Performance on Difficult Content

AVIF handles content that other formats struggle with — dark scenes, smooth gradients, high-frequency textures — better than JPG and WebP. It produces fewer visible artifacts on these challenging images.

Open and Royalty-Free

AVIF is based on the royalty-free AV1 codec, which means there are no patent licensing fees for using it. This is a significant advantage over HEIC, which requires licensing the HEVC patents.

Limitations of AVIF

Slower Encoding

AVIF encoding is computationally intensive, especially at high quality settings. Encoding a single image can take several seconds, compared to milliseconds for JPG. This matters for:

• Real-time applications: If you need to generate images on-the-fly, AVIF encoding may be too slow.
• Bulk processing: Converting thousands of images to AVIF takes significantly longer than converting to JPG or WebP.
• Server-side processing: If your server generates image variants on request, AVIF encoding may add latency.

The encoding speed has improved with hardware support and optimized encoders, but it remains slower than other formats.

Browser Support Gaps

While AVIF is supported by all major browsers in 2026, there are still some gaps:

• Some older browser versions do not support it.
• Some embedded browsers and web views may not support it.
• Some image editing and management tools do not yet support AVIF natively.

For web use, these gaps are handled by serving AVIF with a fallback format (usually WebP or JPG) using the picture element.

Decoding Complexity

AVIF decoding is more complex than JPG or PNG decoding. On low-powered devices, decoding large AVIF images can be slower, though the difference is usually negligible compared to the time saved downloading the smaller file.

How to Create AVIF Images

Converting Existing Images

You can convert existing images to AVIF using:

• Online converters: Several online tools support AVIF conversion. Upload an image, choose quality settings, and download the AVIF file.
• Desktop editors: Photoshop, Affinity Photo, and other modern editors can export to AVIF. Support is growing but may not be available in all editors.
• Command-line tools: The avifenc tool (part of libavif) converts images to AVIF with control over quality, speed, and other parameters. This is the best choice for batch conversion and automation.
• CDN services: Some CDNs, including Cloudflare and Cloudinary, can automatically generate and serve AVIF versions of your images.

Recommended Settings

• For photographs: AVIF at quality 60 to 70 (on the avifenc scale, which is different from the JPG scale) typically gives excellent results. The exact setting depends on the content — test a few values and compare.
• For graphics with transparency: Lossless AVIF or high-quality lossy AVIF both work. Test both and use the smaller one.
• Encoding speed: Most encoders offer a speed setting (usually 0 to 10, where 0 is slowest and highest quality, and 10 is fastest and lowest quality). For most web use, speed 6 to 8 gives a good balance of encoding time and file size.

Serving AVIF on the Web

The Picture Element

The standard way to serve AVIF with fallbacks is the HTML picture element. List the AVIF source first, then WebP, then JPG or PNG as the final fallback. Modern browsers load the best format they support; older browsers fall back through the list.

This approach ensures that every user gets the best format their browser supports, without any user-agent sniffing or server-side logic.

CDN and CMS Integration

Many CDNs and CMS platforms can generate and serve AVIF automatically:

• Cloudflare: Automatically generates AVIF versions of images served through its CDN, based on the browser's Accept header.
• Cloudinary: Supports AVIF as one of its automatic format options.
• WordPress: Plugins like ShortPixel and Imagify can generate AVIF versions of uploaded images.

If you use one of these services, you may not need to manage AVIF conversion manually — the platform handles it for you.

When to Use AVIF

Use AVIF When:

• Performance is critical: For image-heavy sites where every kilobyte matters, AVIF gives the smallest files.
• You can serve fallbacks: If you can use the picture element or a CDN that handles format negotiation, AVIF is safe to use.
• You have time for encoding: If you generate images in advance (not in real-time), the slower encoding is not a problem.
• You need HDR: For high dynamic range content, AVIF's 10-bit and 12-bit support is a significant advantage.

Skip AVIF When:

• You need real-time encoding: If you generate images on-the-fly, AVIF encoding may be too slow. Use WebP instead.
• You need maximum compatibility: If a significant portion of your audience uses browsers that do not support AVIF and you cannot serve fallbacks, stick with JPG or WebP.
• Your tools do not support it: If your image editing workflow does not support AVIF, the conversion friction may not be worth it. Use WebP instead.

Conclusion

AVIF is the most compression-efficient image format widely available in 2026. It produces smaller files than JPG, PNG, and WebP, supports transparency, animation, and high dynamic range, and is open and royalty-free. Its main limitations are slower encoding and some browser support gaps, both of which are manageable with proper fallbacks and workflow planning. For performance-focused websites, AVIF is the best choice for primary image delivery, with WebP and JPG as fallbacks. By adopting AVIF, you can deliver the smallest possible images to your users, improving load times, Core Web Vitals, and overall user experience.