Greg Benz Photography

Photoshop now natively supports AVIF for 50% smaller files than JPG

Note: the images in this post are all AVIF (uploaded normally through the WordPress media library).

JPG has been the most popular image format for over 30 years, but it’s days are numbered. There have been several attempts over the years to replace it, but none have broadly succeeded because they either offered too little benefit or didn’t get enough support from browsers and other critical support. We finally have a file format which seems very likely to start replacing in the coming years: AVIF (AV1 Image File Format). And Photoshop v26.8 beta just added support for it (as well as JXL).

 

AVIF is a vastly better image format and it’s supported by every modern web browser. It offers the following benefits over JPG:

• Vastly smaller files (averaging about 50% smaller in my testing, but 20-80% is typical depending on the image). This size reduction allows faster uploads, faster websites (potentially improving search engine rankings), reduced bandwidth costs, improved battery life on phones and laptops, etc.
• Improved image quality. AVIF supports supports up to 12-bit depth (vs 8 for JPG). That eliminates the risk of banding in smooth gradients like skies. It also means your images could survive a little bit more editing, which makes AVIF rather handy if you send your images to a lab to be printed (the file size reduction vs a 16-bit TIF is astronomical). And beyond bit-depth, artifacts in AVIF tend to be less obvious than in a JPG.
• Transparency. JPG doesn’t support it and PNG files are quite large. So this is great for product images, etc on websites.
• Native support for HDR. While gain maps are critical to ensure high-quality adaptation even with native HDR encoding, this helps further reduce file size (a gain map may be compressed more aggressively, or can be eliminated in cases where file size is more important than ensuring high quality across all screens). See here for more information on why gain maps are important for quality (even in 10+ bit-depth formats).
• Animation. AVIF offers vastly higher image quality than GIF, and in fact is a video standard at its core (AVIF photos are really just a single frame AV1 video).

 

How does AVIF compare to JPG, JXL, webP, and PNG?

There are several notable alternatives to JPG, how do they compare for photography?

First, a quick note that all the formats below support “gain maps” for HDR. There is a common mis-perception that gain maps are just a hack to allow HDR within the 8-bit limits of JPG. While they have that benefit, they serve a much more important purpose: they ensure that an HDR image looks great on any display (without it, less capable displays or screens in outdoor light will often show a significantly degraded result and will vary from one browser to the next). However, native support for HDR is very helpful as it allows for encoding smaller gain maps as well as the option to skip the gain map when file size is much more important than image quality.

JPG:

• Pros:
  • The most widely supported image format for the web (100% compatible).
  • Offers a safe and compatible way to share hiqh-quality HDR today (when using a gain map). This is likely to be replaced by AVIF gain maps in the future as support grows, but is very helpful in 2025.
  • Accepted by all social media sites for uploads.
  • Widely supported for smart phones / texting
• Cons:
  • Files are much larger than newer alternatives
  • Limited quality due to 8-bit depth and artifacts
  • no support for transparency

AVIF:

• Pros:
  • ~50% smaller than JPG (vastly faster page loads, better search ranking, less data use).
  • 10 and 12-bit support and less distracting artifacts offer much higher quality than JPG.
  • Supports HDR gain maps
  • Supports HDR natively
    • This gives the option to encode HDR at the smallest possible size.
    • (a gain map always offers vastly higher quality, but this gives the option to compress a gain map even further or to eliminate the map if file size is more important than image quality)
  • support for transparency.
  • Widely supported on the web (by all modern browsers).
  • Has excellent support in Adobe software. AVIF is royalty free and has great momentum, so support is very likely to expand further elsewhere.
  • Supports CICP encoding to help reduce file size vs embedding an ICC profile.
• Cons:
  • Support is excellent in modern browsers, but there are enough outdated browsers that social media support is limited at this time.
    • Use of very old devices or slow updates means compatibility is ~95% today (but steadily increasing). This is the key reason its use is limited. It would be reasonable to use now in many cases, and you can set your website to serve a JPG fallback image if you want to ensure vastly faster page loads while ensuring 100% compatibility for all devices.
    • Affinity can import but not yet export, Capture One has no support yet, GIMP support is available (if you install libheif or libavif).
  • Not an ideal option for large prints (limited resolution, tiling can expand those limits but risks potential quality issues).
  • 12-bits is great for a final image, but is not ideal for subsequent editing.

JXL (aka JPEG XL):

• Pros:
  • For web use, has benefits generally similar to AVIF (~50% smaller than JPG, high bit depth support, transparency, supports HDR and gain maps, well supported by Adobe)
  • Additionally offers the ability to re-compress existing JPG to JXL with no further loss of image quality, making it very easy to migrate any website to much smaller images.
  • Ideal for printing / subsequent editing due to nearly unlimited resolution and 32-bit support.
  • Has excellent support in Adobe software (including 8-32bit exports from PS v26.8 beta). JXL is royalty free and has great momentum, so support is very likely to expand further elsewhere.
  • Supports encoding color data in the code stream to help reduce file size vs embedding a full ICC profile.
• Cons:
  • Limited support in web browsers (~14%). Chrome had support under a developer flag and removed it. If Google revisits that decision, JXL could become a very exciting option several years down the road (close to 80% of web traffic is based on Chrome or derivative browsers).

HEIF (HEIC):

• Pros:
  • For web use, has benefits similar to AVIF (though may not compress quite as well)
  • Well supported on Apple devices (native capture format on iPhones)
  • Supports higher resolution than AVIF without tiling, so it could be often used for print-quality images.
  • Supports color encoding as CICP to save space vs an embedded ICC profile.
• Cons:
  • Limited support in web browsers (~14%). Due to royalty considerations, it seems unlikely support will expand significantly anytime soon.
  • Lacks 32-bit support offered by JXL for subsequent editing (16-bit support is theoretically pretty good, but actual support for HEIF is often limited to 12-bits).

webP:

• Pros:
  • ~25% smaller than JPG
  • Widely supported on the web (by all modern browsers).
  • Faster encode speed than AVIF, which is attractive for websites processing very large numbers of images.
• Cons:
  • Like JPG, it is limited to 8-bit depth and lacks support for transparency.
  • No support for HDR (either natively or with a gain map).
  • Like AVIF, some old browsers lack support (webP support is ~96%).

PNG:

• Pros: Widely supported as a way to share images with transparency
• Cons: Very large files (PNG is likely to get replaced by AVIF).

 

How to create AVIF:

There are several tools which support exporting photos as AVIF:

• Photoshop v26.8 beta
• Web Sharp Pro v6.4 offers an AVIF option when using this new version of Photoshop.
• Lightroom (Classic, cloud, mobile)
• Adobe Camera RAW (tutorial)

 

Below are two copies of the same 1000 x 667 pixel image. The first is a 192 KB JPG, and the second is a similar AVIF which is only 96KB (50% smaller, but slightly higher quality!)

 

Where can you view AVIF?:

AVIF is well supported for viewing in:

• all modern web browsers (see “can I use” for the latest stats for old browsers).
• Apple Photos / Finder (iOS 16+ and macOS 13+)
• Android and Google Photos (Android 12+)

 

AVIF is NOT supported in:

• Apple iMessage (as of iOS 18, comes through as an icon you cannot view or save)

 

Note: please comment below on any software you feel is critical to add to this supported / not supported list.

 

Which social sites supports AVIF?

As social media sites emphasize support for a wide range of old devices, old apps, old browsers, and old operating systems; it is not surprising that support for a new file will be slow to arrive on social media. Most sites will not accept AVIF uploads, and the ones that do are generally going to transcode the upload to JPG to ensure support on legacy devices (ie it won’t improve the quality of what other see currently, but it will let you upload from a smaller source).

Sites that allow AVIF uploads:

• Bluesky
• Discord
• Facebook
• Instagram
• Threads

Sites that do not yet support AVIF (as of 05-26-24): 500px, Flickr, Pinterest, Reddit, SmugMug, Twitter, and WhatsApp.

 

Should you share AVIF now?:

You can use AVIF now on your own website if you are either

• unconcerned about a small number of viewers (mostly with very old devices) not having support
  • Note that the gaps in support are fairly niche and probably not terribly important for most photography sites:
    • 1.3% of browsing involved old iOS (mostly iPhones older than iPhone 8, as they can’t run iOS16). This is probably the only
    • 0.5% Internet Explorer (mostly people running something older than Windows 10)
    • 0.4% old Chrome, , QQ (Chinese browser, 0.2%)
• willing to batch export both AVIF and JPG and use the script below (which will offer the speed benefit of AVIF to 95% of your audience and ensure the other 5% can still safely see JPG).

However, you should probably otherwise wait a little bit longer if:

• you prefer simplicity of administering your site over speed / ranking
• you share everything through social media
• note yet supported for uploading to a given social media site
• texting via iMessage.
• sharing HDR until AVIF gain maps are better supported (a JPG gain map will produce much better quality overall than an AVIF without a gain map due to superior adaptation to all displays). It’s great that we have such widespread support in browsers and Adobe software, but the remaining gaps are still a reason to move slowly at this time.

So we are still early for many use cases, but AVIF is steadily moving towards critical mass and offers extremely compelling benefits over JPG. I encourage you to test it for yourself, try uploading AVIF to see where it works, and send a polite request for support to any services you use which do not yet accept AVIF uploads.

 

How to enable JPG fallback for any AVIF image on your website:

If you’d like to share AVIF now to help offer vastly faster page load times but also wish to ensure that even the ~5% of viewers who lack support still see your images, you can easily automate that. Just batch export both AVIF and JPG versions of your image using the same name, insert the AVIF normally on your site, and use the following script to have the page automatically replace all <img> elements using an AVIF with <picture> elements which use either AVIF where possible but fallback to JPG if not supported.

Which colorspace should you use for photography?

There is often confusion around the best colorspace to use for photography. In this video, we’ll go into great detail to help compare the key options and why you might pick one or another. You’ll also learn how colorspace affects detail and contrast (not just the vibrance of your color).

 

We’ll get into the details and rationale below, but let’s start with the conclusions to make things clear (or for those who just want the bottom line).

Photographers should choose colorspaces as follows:

• Layered, 16/32-bit working files in Photoshop:
  • Use Rec2020 or ProPhoto. Either is great (I recommend Rec2020 if you can easily choose it). See below for nuances of the differences.
  • Do not use a smaller gamut unless trying to match gamma for an existing project (may be helpful for copying layers with masks). Reducing gamut in the ultimate source eliminates colors which often show benefits on a monitor or print. You can safely export a flat copy in a smaller gamut later.
• Exporting to the web:
  • P3 is ideal as long as long as the profile is not be stripped from the image during upload (which would make the image look desaturated). Browsers support P3 well.
  • In the future (with 10-bit+ formats like AVIF and wider gamut monitors), Rec2020 will be a great choice. It should not be used with 8-bit formats like JPG, due to risk of banding.
  • sRGB is safe when you know the profile will be stripped or are unsure. (Note: as we start to transition away from JPG in about a year with newer format like AVIF, hopefully this issue with stripped profiles goes away).
  • When you convert color, do it on a flattened copy – not with layers (see “This will wreck your color in Photoshop” for a demo).

You do not have to make any colorspace decisions while shooting or editing RAW. A RAW image from your camera has no colorspace (when you pick a colorspace in your camera, it will affect the preview and histo on the camera, but does not limit your editing options). The only time you really need to consider colorspace with LR / ACR is when you export that RAW image or open it in Photoshop (as it will be in a defined colorspace once you leave the RAW environment). Note that while in the RAW editing environment, ACR will use the colorspace you select below the image and LR will always work with linear ProPhoto (aka “Melissa RGB”) in SDR mode and linear Rec2020 in HDR mode.

 

 

What matters when considering colorspace?:

The key factors to consider in selecting a colorspace are:

• Will it retain all the color from your original image / edit?
  • If you use a smaller gamut, the image will not be as vivid for some subjects.
  • A more significant issue is clipping colorful gradients (sunset, colorful light on a wall, etc). When this occurs, there is a loss of detail and the image may appear as if it has artifacts.
• Will colors be clipped on a monitor or print?
  • This is kind of the same question, but more pragmatic.
  • For example, if you do not expect to print green/cyan/blue gradients (such as the ocean by a sandy beach), you may have less need for colors beyond P3 or Rec2020.
  • If you want to protect for future use, then Rec2020 for monitors and a very wide gamut print such as Lumachrome are ideal targets.
  • It is possible we’ll get beyond those in the future, but not very likely and the incremental value would be very low. Natural colors are already well covered, but a very vibrant artificial light might show a benefit. We’re mostly in the realm of animated movies when considering these colors.
• Will the the colorspace be supported online?
  • Browser support is very good for images tagged with sRGB, P3 and Rec2020.
  • (note Firefox may over-saturated untagged images under default settings, but nothing is really safe in that scenario as you can’t even share sRGB to avoid the issue – the only solution is for websites to stop stripping profiles).
  • Browser support is very limited or missing for Adobe and ProPhoto RGB.
• Is there a risk of banding at low bit depth?
  • When you use a wide gamut, your bits are spread out over a larger space. So using a wide gamut space increases risk of banding with wider gamuts.
  • Practically speaking, you should avoid Rec2020 or ProPhoto when the image is encoded at 8-bit. But no issue using them at higher bit depths (including 10-bit for Rec2020).
• Are you editing for SDR or HDR?
  • There are several colorspaces which are supported in SDR, but not HDR. For example, Adobe RGB and ProPhoto RGB are not well supported for HDR.
  • sRGB, P3, and Rec2020 are well supported in both.
• Will the EOTF (“gamma”) affect your workflow or results?
  • When converting a flat image with sufficient bit depth, the EOTF (“gamma”) should not affect results. Color management can safely convert an image from one gamma to another with a visually identical result, as long as you have sufficient bit depth.
  • What you should avoid is converting color space after an image has been downgraded to 8-bits, as that creates risk of banding. This is otherwise not an issue (you’d have to do numerous conversions at higher bit depth to cause problems).
  • The “gamma” affects several aspects of Photoshop, including curves, opacity, and layer masks. You should not convert images which are not flat. If you copy a layer with opacity (such as a subject you cut out), you may find the edges no longer look correct if the gamma changed.
  • See “This will wreck your color in Photoshop” for a demo of these concerns.
  • Note that these considerations for EOTF generally apply for white point (ie not a concern to convert a high quality source).

 

How do common colorspaces differ?:

Before we discuss specific colorspaces, let’s define a few terms associated with them:

• The “primaries” (ie a 2-dimensional “gamut”) define the maximum red, green, and blue (in a matrix-based profile, which would apply to any working RGB space).
• “lightness” (aka value or luminance) is also part of a colorspace, but we have typically ignored it in SDR as working spaces always include both black and white. However, this overlooks the fact that the maximum lightness of a given color often differs from one colorspace to another, even if the primaries are similar.
• The “color volume” is a 3-dimensional representation of all possible values for a colorspace. We’ve typically focused on the primaries in evaluating SDR, but it matters and the impact of lightness / color volume and have especially important in HDR.
• The “EOTF” (“electro-optical transfer function”) determines how quickly values ramp from black to maximum. This is commonly referred to as “gamma”, but there are ETOFs which are not gamma curves (including sRGB). EOTF doesn’t matter that much in this conversation, but is noted where relevant.
• The “white point” determines the color of white. Color management accounts for different white points (through chromatic adaptation), and the white point similarly doesn’t matter much for this conversation.

 

The most common colorspaces typically considered for photography include:

• sRGB
  • This is the smallest gamut.
  • Same primaries as rec709.
  • The sRGB EOTF is close to gamma 2.2 (rec709 uses BT.1886 and is closer to gamma 2.4)
• Adobe RGB
  • Wider gamut than sRGB, with the benefit more optimized for printing relative to P3
• P3 RGB
  • Wider gamut than sRGB, with the benefit more optimized for monitors than Adobe RGB
  • Most modern monitors use P3 as a design target
• Rec2020
  • Wider gamut than P3.
  • Fully includes all colors available in sRGB, Adobe RGB and P3.
  • Given the large range, it is not suitable for 8-bit encoding due to some risk of banding.
  • The gamma is typically a higher-precision version of rec709, though the ICC-2020.icu profile that comes with MacOS appears to be close to sRGB (ie close to gamma 2.2)
  • Rec2020 is the ultimate target for HDR and monitors. It is the ideal target, but most monitors today don’t go much past P3. Some laser projectors and RGB mini-LED displays come fairly close to covering it.
• ProPhoto RGB
  • Wider than Rec2020, so it fully encompasses all of the above. It also exceeds human vision and roughly 13% of are “imaginary” colors which are not visible to humans.
  • Given the large range, it is not suitable for 8-bit encoding due to significant risk of banding.
  • Gamma 1.8

Note that ProPhoto RGB has a D50 white point, while D65 is typically used for sRGB, P3, Adobe RGB, and Rec2020. This really doesn’t matter here as color management accounts for this. Not convinced? Try opening a flattened 16-bit sRGB TIF and then convert it to ProPhoto – it will look the same (even though you’ve just changed both white point and ETOF, and the primaries aren’t a problem in this example since you’ve moved to a larger space).

In the world of movies / CG, there are some additional ACES options you may encounter. The AP0 primaries are the smallest triangle that includes all visible colors (this is much larger than ProPhoto and has far more imaginary colors). The AP1 primaries are rather close to Rec2020, but the gamut is just slightly larger. Neither is well supported for photography and you should avoid them unless you need them for working with stills in your video.

You should avoid converting working images to a printer profile (you can safely do this on an exported copy if desired, just avoid it for the original work). You should also avoid setting Photoshop’s working space to monitor RGB (this will cause Photoshop to strip embedded profiles when you open images, creating significant risk for color problems).

 

Which colorspace should you use?:

Now that you understand the key considerations and the options, how did I arrive at the recommendations above?

• You should use a wide gamut to preserve color in your layered, working image, as this often helps create better prints and allows your image to benefit from electronic display as monitors continue to improve.
  • There is no benefit to using a small gamut in your working file, even if your monitor won’t show it (colors beyond your display will naturally look great based on the editing you do for the color you can accurately see).
  • ProPhoto is the most practical wide gamut option today as LR / PS make it easy to use and it includes all colors which we might use on a printer or monitor (even well into the future).
  • Rec2020 an the ideal space as it is the ultimate target for HDR and monitors, includes almost all printable color, has a white point and gamma which align well with other smaller colorspaces, allows you to use the same primaries in both SDR and HDR edits, and doesn’t have the waste / imaginary colors of ProPhoto (which in rare cases may cause problems printing). Adobe doesn’t have enough support in LR and Photoshop to make it super easy to use yet outside HDR, but it will be an ideal choice when possible.
• Browsers support sRGB, P3, and Rec2020 very well – but not other spaces like Adobe RGB and ProPhoto.
  • However, Websites may strip profiles. When that occurs, sRGB is the only safe option as it is assumed when color is not defined. Profiles are removed to save some file space in a JPG. However, newer file formats like AVIF can specify color with only 4 bytes and that should hopefully help end these issues which force us to share sRGB in some cases today.
• Note: RAW does not have a colorspace and I’ve therefore ignored it (colorspace options in your image do not limit your RAW).

 

Why might you use Rec2020 vs ProPhoto?:

ProPhoto is widely supported for SDR editing and can retain some printable colors which Rec2020 cannot (as shown at the 6:20 mark in the video above). It’s a great space and I do recommend ProPhoto. So why do I have a preference for Rec2020?

• There is simplicity in using a single colorspace as much as possible.
  • Rec2020 is supported for all RAW conversions, ProPhoto is only an option when not editing in HDR mode.
  • Rec2020 already has good support in browsers and is much more likely to be used correctly when you upload images. We’ll soon be able to export from layered Rec2020 images to the web in Rec2020.
  • Browsers do not support ProPhoto, and this is unlikely to change. Even if they did, they would probably be more prone to having their profile stripped when uploaded (the backend tools used to transcode images don’t often support ProPhoto, and there is no CICP code for the ProPhoto primaries). In other words, images would may be prone to significant desaturation and color error.
• It may be helpful to avoid the imaginary colors of ProPhoto.
  • In rare cases, wide gamut ProPhoto images may not convert to or soft proof well under some printer profiles.
  • That said, you could convert from ProPhoto to Rec2020 to avoid any issue (it’s just a direct jump from ProPhoto that might be an issue).
• On the flip side, ProPhoto retains some printable green/cyan values that Rec2020 does not, but the gap is trivial in reality.
  • Monitor’s don’t yet cover Rec2020 and aren’t very likely to exceed it (as it is the ultimate target for HDR / manufacturers).
  • ProPhoto has very little practical advantage for printing. Rec2020 is covers nearly all of Pointer’s gamut.
    • The additional color could theoretically benefit dark gradients with green/cyan/blue. As these colors are beyond Pointer’s gamut (real world reflective color), the only scenario I can think of might involve a gradient from the aurora or artificial lights.
    • As the gap here is in dark values (and those are bright subjects), it would only affect the dark transitions at the edge of the light. I think you’d be hard pressed to find a real photo where this shows a benefit in print.

Rec2020 is the simple option if you have a choice (and covers real color just as well as ProPhoto). ProPhoto is also a great choice.

 

Tips for working with ColorSync Utility on MacOS:

MacOS comes with a very handy ICC profile viewer in ColorSync Utility (there are various 3rd-party options like iccview for Windows, but nothing built into the OS). It’s very helpful for understanding and comparing colorspaces.

• ColorSync Utility should be found in the Utilities folder in MacOS. Go to the Profiles tab and then the RGB profiles on the left to find various profiles to instead or compare.
• Right-click the 3D view and choose “Yuv” for a more intuitive representation of the data.
• Right-click and choose “hold for comparison”, then click on another profile to compare them (if one is much larger than the other, be sure to hold it so you can see both for comparison).
• Click and drag the 3D view to rotate it.
• If you hold <option>, you can click and drag up and down to zoom in and out.
• Advances users might wish to double-click a profile to open it and view its contents in detail (white point, etc).