AVIF vs HEIC

AVIF and HEIC are the same idea built on two different codecs. Both wrap intra-coded frames from a modern video codec inside the ISOBMFF container shared by MP4. The decisive difference is the codec underneath: AVIF carries royalty-free AV1, HEIC carries patent-encumbered HEVC (H.265). That single fact explains why every major browser shipped AVIF and none shipped HEIC. This page analyses the licensing split, the support gap, and the one workflow that uses both formats correctly.

Same container, different codec

Both formats use ISOBMFF, but each wraps a different codec's keyframe. This is the root of every practical difference below.

• AVIF wraps an AV1 intra frame — one keyframe from the AV1 video codec.
• HEIC wraps an HEVC (H.265) intra frame — one keyframe from the H.265 video codec.
• Both inherit ISOBMFF features: primary image items, thumbnails, alpha and depth maps, image sequences, and EXIF/XMP metadata.

The container is identical plumbing. The codec inside determines who can legally decode it for free, and that is what divided the two formats' fates. For the full container breakdown see AVIF Format and HEIC Format.

Licensing: the reason browsers chose AVIF

Licensing, not compression, is why AVIF won the web. HEVC is governed by three separate patent pools — MPEG LA, Access Advance (formerly HEVC Advance), and Velos Media — with overlapping, inconsistent terms. AV1 is published royalty-free by the Alliance for Open Media.

Three consequences follow directly:

• Per-device royalties. HEVC decoding can cost device makers several dollars per unit across pools; AV1 costs nothing.
• Open-source friction. A browser shipping a free HEVC decoder would owe royalties it cannot recoup, so Chromium and Firefox declined HEIC outright.
• Vendor alignment. Google, Mozilla, Microsoft, Netflix, Amazon, and Apple co-founded AOMedia in 2015 specifically to build a successor that escaped HEVC's licensing. AVIF is the still-image fruit of that effort.

Apple absorbs HEVC's cost into hardware margins, so HEIC is free to the iPhone user but not free to a browser vendor. Background on the cost structure is documented by the Streaming Learning Center on HEVC licensing and the AV1 article on Wikipedia.

Browser support: ~94% vs near-zero

For the web this is decisive. AVIF renders natively in Chrome, Firefox, Edge, and Safari — about 94% of global users; HEIC renders in no mainstream browser's <img> tag except Safari, leaving effective web support near zero.

Even Safari's HEIC handling rides the macOS/iOS system decoder, so it is not portable to other engines. Serve a .heic file to the open web and most visitors get a broken image; serve AVIF and nearly everyone sees it. The current support detail is tracked on caniuse: HEIF/HEIC and documented in HEICcon's "Why You Can't Use HEIC on Websites". For AVIF fallback patterns, see AVIF Browser Support.

Compression: a genuine tie

Neither format wins decisively on bytes. AV1 and HEVC have similar intra-frame coding efficiency, so AVIF and HEIC both land around half the size of JPG at matched quality on photographic content.

The differences that exist are small and content-dependent:

• AV1's wider transform set and directional prediction can edge ahead on gradients and synthetic content.
• HEVC's mature intra prediction holds parity on typical camera photographs.
• At very high quality both converge toward near-lossless, erasing the gap.

Because compression is a wash, the real decision is driven entirely by reach and licensing — which is where AVIF separates. AV1's broader codec advantage over H.265 is covered by Wikipedia's AV1 article.

Capture vs delivery: the right mental model

The cleanest way to think about these formats is by job, not by quality. HEIC is a capture-and-storage format; AVIF is a delivery format. They rarely compete because they serve different ends of the pipeline.

• HEIC's home is the camera. iPhones have shot HEIC by default since iOS 11 (2017), using a dedicated hardware HEVC encoder that saves photos in real time at minimal power. Apple Photos, iCloud Photo Library, Live Photos, and depth maps all flow through it natively.
• AVIF's home is the web page. Software AVIF encoding is slow — seconds per high-quality image — but you encode once and serve millions of times, so the cost amortises away.

A format optimised for instant on-device capture is not the same as one optimised for byte-minimal delivery. HEIC and AVIF each win their own half.

The one workflow that uses both

In practice you accept HEIC as input and emit AVIF as output. HEIC never belongs inside a <picture> element; it belongs in the upload handler.

1. A user uploads a .heic file (common straight from an iPhone).
2. The server detects HEIC and transcodes it with libheif or Sharp.
3. The site serves AVIF to capable browsers, with WebP and JPG fallbacks.

import sharp from "sharp";

// Transcode an iPhone HEIC upload to web-ready AVIF
await sharp("upload.heic")
  .rotate() // bake in EXIF orientation before re-encode
  .avif({ quality: 50, effort: 4 })
  .toFile("output.avif");

The .rotate() call is load-bearing: iPhones store orientation in EXIF rather than rotating pixels, so the encoder must apply it or the output lands sideways. Tuning the quality and effort values is covered in AVIF Optimization, and the page-speed payoff in Core Web Vitals for Images.

Shared strengths beyond compression

Both formats carry the same modern feature set, inherited from their video-codec lineage.

• 10-bit and 12-bit colour — far less gradient banding than 8-bit JPG.
• HDR transfer functions — PQ and HLG, with BT.2020 and Display P3 wide gamut.
• Alpha transparency — a full auxiliary alpha plane in both containers.

The feature parity is real, but only AVIF can deliver any of it to a browser. HDR in a HEIC file stays trapped in Apple's apps until you transcode it.

FAQ

Can browsers display HEIC?

Only Safari, and only via the operating system's decoder. Chrome, Firefox, and Edge do not render HEIC in an <img> tag at all, because doing so would require a licensed HEVC decoder. For the open web, treat HEIC as undisplayable and convert it to AVIF first.

Should I convert iPhone HEIC to AVIF for the web?

Yes. Transcode HEIC to AVIF for any image headed to a web page, because HEIC will not render for most visitors while AVIF reaches ~94% of them. Keep the original HEIC inside Apple's ecosystem if you want; convert a copy for delivery.

Is AVIF or HEIC smaller?

They are effectively tied. Both compress photographic content to roughly half a JPG's size, and head-to-head results are too close to matter. Choose on browser support and licensing — where AVIF wins outright — not on file size.

Convert your images

These converters run entirely in your browser — the image never leaves your device:

• Convert JPG to AVIF, Convert PNG to AVIF — produce web-ready AVIF
• Convert AVIF to JPG, Convert AVIF to PNG — convert AVIF back for editing or sharing

Sources and further reading

• caniuse: HEIF/HEIC support tables
• HEICcon: Why You Can't Use HEIC on Websites
• Streaming Learning Center: HEVC licensing
• AV1 — Wikipedia
• AVIF vs JPG — AVIF against the universal legacy format
• AVIF vs WebP — the two royalty-free modern web formats compared