Tools / Preview

Compare SDR and HDR, side by side

Upload a gain-map HDR JPEG (from Encode, or your own) to compare it against its SDR base. We never fake HDR — every panel is labeled as either the real file or a tone-mapped simulation.

Drop an image here
or choose a file
JPEG · PNG · WebP · AVIF

How Preview actually works

Preview decodes your file in a Web Worker, splits out the primary image and — if present — the embedded gain map, and builds two things from them: the real primary image (what "Actual HDR" shows), and a simulated SDR approximation of the boosted result (what "Simulated HDR" shows), using the same reconstruction math described on the gain map and Superwhite mode explanations.

The split and side-by-side layouts don't resize or recompress anything — they display the same decoded images at full quality, just arranged differently. The split divider is a real keyboard-accessible slider (arrow keys move it, not just dragging), not a decorative overlay.

The HDR-display indicator in the control bar runs a live capability probe — matchMedia('(dynamic-range: high)') — against your actual browser and OS, right now. It's the same check the Compatibility Checker runs, not a static assumption based on your device or browser version.

Questions people actually ask

What's actually different between 'Actual HDR' and 'Simulated HDR'?
Actual HDR renders the real file, completely unmodified — if it looks brighter, that's your display and OS genuinely rendering the embedded HDR data, not an effect this page applied. Simulated HDR is a separate, real calculation: it reconstructs HDR luminance from the file's embedded gain map, then tone-maps it back down with a soft-knee highlight rolloff so an ordinary SDR display can show an approximation of the boost. Neither one is fake — they're just answering different questions.
Why does 'Actual HDR' look identical to SDR on my screen?
Almost always because the display or browser isn't currently reporting HDR support — check the indicator in the control bar, which queries this live via the CSS dynamic-range media feature. If it says your display doesn't report HDR support, the file may be rendering completely correctly; your screen just isn't in a state to show the extra range right now.
What happens if I preview a file with no gain map?
You get an honest message saying so, and only the SDR image — Preview won't fabricate an HDR comparison for a file that doesn't have real HDR data. Use Encode if you want to add a gain map to it first.
Does the reconstructed nits estimate come from a real calculation?
Yes — it's computed by actually recombining the primary image with the file's embedded gain map, per that file's own hdrgm metadata (gain map min/max, gamma, offsets). It's still labeled an estimate, since it assumes a 100-nit SDR white point and omits the spec's small offset epsilon terms, but it's a real calculation from the file's own embedded data, not a placeholder number.