The AVIF file (.avif)

AVIF stores a picture compressed with AV1, a video codec released in 2018 by the Alliance for Open Media, an industry group whose members include Google, Apple, Microsoft, Mozilla, Netflix and Amazon. A still AVIF image is, in effect, a single frame of AV1 video, wrapped in a container that also holds its size, colour information, transparency and metadata.

The container is HEIF, the same ISO standard Apple uses for HEIC photos, and the same box structure MP4 video files use. So AVIF and HEIC are close relatives: the difference is the codec inside. HEIC uses HEVC, which is covered by patent licences; AV1 was designed to be royalty-free, which is a large part of why every major browser adopted AVIF and none (apart from Safari) adopted HEIC.

AVIF is mostly used on websites, where image CDNs and frameworks send it to browsers that accept it because it's often the smallest option. Chrome has shown AVIF since version 85 (2020), Firefox since 93 (2021) and Safari since 16.1 (2022). Outside the browser, support is newer and patchier than for JPEG, PNG or even WebP.

Compared with older formats, AVIF adds:

• Smaller files. AOMedia cites tests by Netflix showing files more than 50% smaller than JPEG at similar quality. Results vary by image and encoder settings.
• More bits per channel. 10 and 12 bits as well as 8, which avoids banding in skies and gradients and makes HDR possible.
• Transparency and animation, like PNG and GIF, in the same format.

There are two layers to an AVIF file: the AV1 compression, which turns pixels into a small bitstream, and the HEIF container, which says what each bitstream is and how to put the picture together.

1. 1Colour conversion. RGB pixels are usually converted to brightness and colour (YUV), and the colour is often stored at half the width and height (4:2:0), as in JPEG and lossy WebP. Unlike lossy WebP, AVIF can also keep full-resolution colour (4:4:4).
2. 2Prediction in flexible blocks. The image is split into blocks from 4 × 4 up to 128 × 128 pixels, sized to fit the content. Each block is predicted from pixels already decoded, using one of many directional patterns, and colour can be predicted from brightness ("chroma from luma"). Only the difference from the prediction is coded.
3. 3Transform and quantise. The differences go through one of several transforms and are rounded according to the quality setting. This is the lossy step.
4. 4Clean-up filters. Deblocking, CDEF (a filter that smooths ringing along edges) and loop restoration reduce visible artefacts before the image is shown.
5. 5Entropy coding packs the result into as few bits as possible.

The container then describes the result as items with properties. Transparency is not part of the colour image: it's a second, greyscale AV1 image marked as an auxiliary alpha item (urn:mpeg:mpegB:cicp:systems:auxiliary:alpha). Very large pictures are split into tiles and joined by a grid item. Animations add an MP4-style track (moov) of frames alongside the still primary image, so viewers that can't animate show a single frame.

Every kind of AVIF has the same .avif extension; the boxes inside show which one you have. Our samples, side by side:

AVIF defines two profiles. Baseline (MA1B) uses AV1's Main profile: 8 or 10 bits, 4:2:0 or greyscale, up to 8,192 × 4,352 pixels per coded image. Advanced (MA1A) uses AV1's High profile, which adds 4:4:4, up to 16,384 × 8,704. Our lossless and HDR samples use 4:4:4, so they're Advanced. Larger images use a grid in either profile.

Our three versions of the same 1200 × 800 synthetic landscape: sample-photo.jpg on the JPEG page is 122,872 bytes at quality 85, sample-lossy.webp on the WebP page is 38,594 bytes at quality 80, and sample-photo.avif here is 31,052 bytes at quality 60. Quality numbers don't mean the same thing across encoders, so this isn't a like-for-like test, but it shows the usual order.

For the transparent artwork shared with our PNG and WebP pages, lossy AVIF is 9,453 bytes against 19,672 for lossy WebP and 33,653 for PNG. Lossless is a different story: the same artwork on a white background is 35,876 bytes as lossless AVIF, more than the PNG with its transparency. For exact copies of graphics, PNG or lossless WebP usually win.

• Use AVIF for photos and large images on your website, with a JPEG or WebP fallback for older software.
• Use WebP when encoding speed matters, or for lossless graphics on the web.
• Use JPG or PNG for files people will download, edit, print or send on.

• It won't open on Windows. Photos and Paint need Microsoft's free AV1 Video Extension from the Microsoft Store. Many PCs already have it.
• An older app or website rejects it. Plenty of upload forms and desktop apps still only accept JPEG, PNG and GIF. Convert to JPEG (below), or check whether the app has an update.
• Fine texture looks smoothed over. At low quality settings AV1 tends to blur fine detail such as skin, grass and film grain rather than producing blocks the way JPEG does. Raise the quality, or use 4:4:4 for images with text.
• The animation doesn't play. Firefox showed only still AVIF images until version 113; older apps and many image libraries still show only the first frame.
• Colours or brightness look wrong. HDR AVIFs look different on HDR and standard screens, and apps that ignore the colr box can shift colours. Our sample-hdr-10bit.avif makes this visible.
• Encoding takes ages. Use a faster speed setting (for example avifenc -s 8), at the cost of a slightly larger file.

• Open it: drag it into any current browser. Windows Photos and Paint open it with the AV1 Video Extension; macOS Preview and Photos open it on macOS 13 Ventura and later; iPhones from iOS 16 and Android phones from Android 12.
• Edit it: GIMP, Krita, recent versions of Photoshop and many online editors open AVIF. Keep a PNG or TIFF master if you'll edit repeatedly, as each lossy save loses a little more.
• Convert to AVIF: avifenc photo.jpg photo.avif (from libavif, with -q for quality and -s for speed); magick photo.png photo.avif with ImageMagick 7; ffmpeg -i in.png -c:v libaom-av1 -still-picture 1 out.avif; or Squoosh in the browser.
• Convert from AVIF: avifdec photo.avif photo.png, magick photo.avif photo.jpg, or File > Export in Preview.
• Inspect it: avifdec --info photo.avif prints the size, depth, YUV format and colour settings; exiftool shows Exif and XMP.

On a web page, offer AVIF with a fallback, and the browser takes 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="A lake at sunset" width="1200" height="800">
</picture>

An AVIF can't run code. The things to watch are the same as for other photo formats:

• Metadata. AVIF can carry Exif and XMP items, including GPS coordinates, camera details and dates, which viewers don't show. Many converters copy them from the source JPEG. Check with exiftool and strip with exiftool -all= photo.avif, or with your encoder's option to drop metadata.
• Decoder bugs. AV1 decoders are large, complex programs, and image decoders are a known attack route (see the 2023 libwebp vulnerability on our WebP page). Keep browsers and image libraries updated.
• Huge images. A small file can declare a grid of many tiles that needs a lot of memory once decoded. Servers that process uploads should check dimensions before decoding.