HDR test

What your browser reports about this display: whether HDR is active, and how wide a colour gamut it can show. Then compare sRGB with Display P3 swatches to see wide gamut for yourself.

Checking your display…

From the CSS media queries dynamic-range, video-dynamic-range and color-gamut. They describe the display as the browser and OS currently drive it, which can differ from the panel's full capability.

sRGB vs Display P3

Each pair shows the most saturated sRGB colour (left) next to the P3 version (right). On a wide-gamut display with a colour-managed browser, the right half looks more vivid. On an sRGB display, both halves look identical.

Red
Green
Blue
Orange

Getting HDR working

  1. Windows 11: Settings → System → Display → HDR → Use HDR. Then run the Windows HDR Calibration app from the Microsoft Store.
  2. macOS: HDR-capable Apple and external displays switch to HDR automatically for HDR content. Check System Settings → Displays for a "High Dynamic Range" toggle on external monitors.
  3. Cable and port: 4K HDR at high refresh needs HDMI 2.1 or DisplayPort 1.4 with DSC.
  4. Monitor: enable HDR input in the on-screen menu if it has one, and choose the DisplayHDR mode for the best tone mapping.

With HDR on, SDR content can look dim or washed out on some setups; adjust the "SDR content brightness" slider in Windows. For banding in HDR gradients, see the banding test; for OLED near-black issues, the uniformity test.

Questions people ask

Why does this say HDR is off when my monitor supports HDR?

The browser reports whether HDR is active for the current output, not whether the panel can do it. On Windows, turn on "Use HDR" in Settings → System → Display. On macOS, HDR-capable displays switch automatically. Some browsers also need hardware acceleration enabled.

Can a browser really show HDR?

Yes, for HDR video and HDR/gain-map images in recent Chrome, Edge and Safari. CSS colours on a regular page are still SDR in most browsers, so this page can detect HDR and wide-gamut support but can't show real HDR highlights with plain CSS.

What is the difference between HDR and wide colour gamut?

HDR is about brightness range: brighter highlights and deeper darks. Wide colour gamut (Display P3, Rec. 2020) is about more saturated colours. Many displays have one without the other.

Is HDR400 real HDR?

VESA DisplayHDR 400 needs only 400 nits peak and no local dimming, so it usually looks little different from SDR. DisplayHDR 600 and above, or True Black tiers for OLED, give a clearly visible HDR effect.