How to keep the HDR from an iPhone photo on the web

Since 2020 and the iPhone 12 generation, the Camera app saves HDR photos. Next to the normal picture, it stores a gain map: a second, smaller image that tells an HDR screen how much brighter each part should be. Since iOS 18, the iPhone 15 and later write it in the ISO 21496-1 form Apple calls Adaptive HDR; older iPhones keep Apple's own form. That is why a sunset looks so bright in the Photos app on the phone.

Getting that photo onto a web page with its HDR intact is harder than it should be.

Why the obvious ways lose the HDR

Uploading the HEIC file. iPhones save photos as HEIC by default. Safari has displayed HEIC since Safari 17, and shows its HDR since Safari 26 on iOS 26 and macOS 26. Chrome, Edge and Firefox do not display HEIC at all. For most of your visitors the image would be missing.

Exporting or sharing it as a JPEG. Converting HEIC to JPEG is easy. But many converters, upload forms and photo editors only write the standard picture. The gain map gets dropped. What comes out is an ordinary JPEG that looks fine but has lost its HDR. Even a conversion that keeps a gain map may write it in a different variant from the one the iPhone used, and not every app reads every variant.

Screenshots, messaging apps and "optimize for web" tools. Almost all of them re-encode the image and lose the gain map. Google Messages and iMessage between recent Apple devices are the reported exceptions.

What you want instead: the same photo in several formats

No single file shows HDR in every browser. A JPEG with an embedded gain map comes closest to working everywhere: it uses the same idea as the iPhone's own HDR, and every browser can open it. But only Chrome, Edge and Safari 26 or later on iOS 26, iPadOS 26 or macOS 26 show its HDR. Firefox, older Safari and Safari 26 on an older macOS show the standard picture.

So publish the photo as a set: a gain map JPEG, an HDR AVIF and a short HDR MP4, embedded with HDRJPG's recommended markup. Each browser then uses a version it can show in HDR, and screens without HDR get a normal photo. That is how the photo reaches the most visitors in HDR. The formats guide explains each format.

Three ways to convert an iPhone photo

1. HDRJPG, online

1. Get the original photo off the phone without converting it. AirDrop between Apple devices sends the HEIC as it is; Apple converts to JPEG only when the receiver cannot handle HEIF. In Photos on a Mac, use File > Export > Export Unmodified Original, not the ordinary export. Avoid sending the photo through a messaging app first.
2. Upload the HEIC at hdrjpg.com/try. HDRJPG reads the iPhone's gain map, rebuilds the HDR image from it, and returns a gain map JPEG, an AVIF, a JPEG XL and two MP4 videos, one in H.264 and one in 10-bit HEVC. This is more than a change of file format: each output file keeps the HDR of the original.
3. Download the files and publish them as they are, with the embedding markup. Do not let your website builder resize or recompress them. See why HDR photos look flat after uploading.

Some photos have no HDR data: older photos, some edited copies, screenshots. For those, HDRJPG expands the standard photo to HDR instead, unless you turn that option off in the settings. That brightens the light already in the file; it cannot bring back highlights the original clipped.

2. Lightroom or Camera Raw

Open the HEIC in Lightroom or Adobe Camera Raw and turn on HDR editing. Export as JPEG with Enable HDR Output and Maximize Compatibility both checked. The second option writes the gain map, in the ISO 21496-1 form. This is the route to take when you want to edit the photo anyway. It is one photo at a time, though, and this route gives you a gain map JPEG only, which most browsers outside Chrome, Edge and recent Safari show without HDR. To reach the others, run the exported JPEG through HDRJPG to get the AVIF and MP4 versions too.

3. The API, for many photos

If you run a portfolio site, a shop or an app where people upload iPhone photos, convert them on upload with the HDRJPG API. Send the HEIC and get back each size your site uses as a gain map JPEG, an AVIF and an MP4, plus JPEG XL if you want it, all still HDR. Put them on the page with the embedding markup, and the photo shows in HDR in almost every browser, on phones and computers alike, with a normal version for screens without HDR. The PHP SDK does the conversion in one call:

$client = new \TinCat\HdrjpgSdkPhp\Client('YOUR_API_KEY');
$client->convert(
    'IMG_1234.HEIC',
    [
        // jpeg-xt is the API's code for the gain map JPEG
        ['width' => 1600, 'format' => 'jpeg-xt'],
        ['width' => 800, 'format' => 'jpeg-xt'],
        ['width' => 1600, 'format' => 'avif'],
        ['width' => 1600, 'format' => 'mp4'],
        ['width' => 1600, 'format' => 'mp4-hevc'],
    ],
    '/path/to/output'
);

Checking the result

Open the published page on an HDR screen in several browsers: Safari on an iPhone, iPad or Mac running iOS 26 or macOS 26 or later, Chrome, and Firefox. The bright parts of the photo should glow brighter than the white page around them. If they do in Chrome but not in Firefox, the page is serving only the gain map JPEG: add the AVIF and MP4 with the embedding markup.