HDR Test

Review browser HDR capability signals and inspect HDR-oriented patterns without claiming hardware measurements.

This check opens a focused test surface. You can return with Escape. Review what this browser test can and cannot measure.

Before you start

  • Move the browser to the display you want to inspect.
  • Confirm the intended operating-system HDR mode and keep room lighting steady.

How to run this check

  1. Check the browser-reported HDR capability signal shown on the page
  2. If available, enable HDR in your operating-system display settings
  3. Start the HDR Test
  4. Cycle through the highlight, color, gradient, dimming, and blooming patterns
  5. Record visible clipping, color shifts, or halos without treating the pattern as a brightness or gamut measurement

What this browser test can tell you

Can help you check

  • Browser-reported dynamic-range and color-gamut signals, plus differences between comparison patterns.

Cannot measure

  • This test cannot confirm active HDR state, peak nits, gamut coverage, local dimming, or HDR certification.
Setup, interpretation, and sources

Recommended setup

  1. Use an HDR-capable browser and display, and keep the test tab visible.
  2. Compare the patterns with the same display mode and room lighting.

How to interpret what you see

  • Record which patterns remain distinct and note any clipped highlights or color shifts.
  • A high dynamic-range media-query match is a browser/output capability signal, not proof that HDR is active; operating-system HDR mode, browser support, tone mapping, and color management can all change the result.
  • Exact brightness and gamut measurements require a calibrated colorimeter or spectroradiometer.

Sources

Methodology reviewed:

💡 Why This Test?

This test reports the browser/output path's HDR-related media-query signals and supplies visual patterns for comparing highlights, gradients, saturated colors, and blooming. Use it to record what you can see under your current settings, not to measure nits, gamut coverage, certification, or whether HDR is definitely active.

✅ What You'll Check:

  • Whether the browser/output path reports a high dynamic range capability
  • Clipped or distinct highlight steps
  • Visible color shifts or gradient bands
  • Halos around bright shapes on dark backgrounds

📖 How to Use This Test

  1. Read the browser/output capability signal below
  2. If your system offers HDR, enable it in the operating-system display settings
  3. Start fullscreen and cycle through all five patterns
  4. Note highlight clipping, color shifts, gradient bands, and blooming halos
  5. Repeat with the same browser, OS mode, room lighting, and display settings before comparing observations

Checking browser/output HDR capability signal…

👀 What You Should See

🌟 Peak Brightness

✅ Normal (HDR)
Very bright white
❌ Problem (SDR)
Dim gray

🎨 Color Gamut

✅ Normal (P3/Rec.2020)
Vivid saturated colors
❌ Problem (sRGB)
Muted colors

📊 Gradient

✅ Normal (10-bit)
Smooth gradient
❌ Problem (8-bit)
Visible bands

🌑 Local Dimming

✅ Normal (Good FALD/OLED)
Pure black background
❌ Problem (No Dimming)
Gray background with halo

💫 Blooming

✅ Normal (Mini-LED/OLED)
Sharp star
❌ Problem (Cheap FALD)
Blurred glow

Inspect browser-rendered HDR-oriented patterns. Press ESC to exit.

✨ What the Browser Can Report

High dynamic-range signal reported

  • • The browser/output media query currently matches
  • • This is a capability signal, not proof that HDR is active
  • • The canvas still supplies illustrative browser-rendered patterns
  • • Nits, gamut coverage, bit depth, and local dimming are not measured

High dynamic-range signal not reported

  • • The current browser/output path does not match the media query
  • • This is not a display failure or a hardware diagnosis
  • • OS mode, browser support, tone mapping, and color management may affect it
  • • The patterns remain visual comparisons, not measurements

📋 Testing Guidelines

🌟 White Highlight Illustration

Note whether the browser-rendered white area clips or changes under your current settings. It does not measure luminance in nits.

🎨 Saturated Color Illustration

Compare the color blocks for visible shifts. Their appearance cannot validate gamut coverage or bit depth.

🌑 Dark-Scene Halo Illustration

Record halos you can see around white shapes on black. The canvas cannot validate local-dimming hardware or performance.

⚡ Hardware Specifications

Confirm certification, luminance, gamut, bit depth, and dimming design from reliable device documentation or calibrated measurements.

📋 How to Test

1

Check the Current Output Mode

Read the browser/output capability signal, then note whether HDR is enabled in the operating-system display settings.

2

Start Fullscreen Test

Navigate through five illustrative patterns: white highlight, saturated colors, gradient, bright shapes on dark, and small white dots on dark.

3

Compare Consistent Setups

If you compare output modes, keep the browser, room lighting, display preset, and color-management settings documented.

4

Record Visible Differences

Note clipped gradient steps, color shifts, or visible halos without treating them as luminance, gamut, or local-dimming measurements.

⚠️ Important Notes

  • • A high dynamic-range match is only a browser/output capability signal
  • • Browser and operating-system support varies
  • • Canvas patterns are illustrative and cannot measure display hardware
  • • Keep observations comparative and confirm specifications independently

🔧 Common Issues & Solutions

💎 "The illustrative patterns look similar across output modes"

What you observed: The browser-rendered white, color, or gradient illustrations did not look substantially different after an output-mode change. Browser support, operating-system HDR state, tone mapping, color management, display settings, and the content itself can all affect that comparison.

Certification context: DisplayHDR and other labels describe requirements defined outside this page. Confirm the exact tier and device specifications from the manufacturer or certification database; these canvas patterns cannot verify a certification, luminance, black level, gamut, bit depth, or dimming design.

✅ Next step: Document the browser/output capability signal and current OS/display settings, then use verified specifications or calibrated measurement when hardware performance matters. The observation does not support an upgrade recommendation.

☀️ "Windows HDR makes everything blindingly bright or washed out" (SDR content in HDR mode)

What you observed: Desktop or browser content looked brighter, dimmer, or less saturated after an operating-system output-mode change. OS mapping, browser support, application rendering, color profiles, GPU processing, and display settings can all contribute.

How to compare: Record the OS output mode, SDR-content control, browser, application, color profile, and display preset. Compare one setting at a time under the same room lighting rather than assigning a luminance or gamut value from appearance.

✅ Next step: Use the operating system's documented display controls and change one setting at a time for comfortable viewing. Use a calibrated workflow when numeric luminance or color accuracy matters.

🌟 "A bright shape on dark has a visible halo"

What you observed: A halo-like area appeared around one or more browser-rendered white shapes on a dark background. Pattern size, browser and OS processing, display preset, ambient light, viewing angle, eyesight, and camera exposure can all affect its appearance.

How to interpret it: Record the pattern, room lighting, viewing position, output mode, and display preset, then compare with ordinary dark content. This page cannot verify local-dimming hardware, zone behavior, black level, or the cause of a halo.

✅ Next step: Change one content, environment, output, or display variable at a time and repeat the direct-view observation. Confirm any dimming design or behavior through device documentation or instrumented testing.

🎬 "HDR content looks wrong - blown out highlights or crushed blacks"

What you observed: Highlight or shadow detail appeared clipped in one content source or application. Content encoding, the application, browser, operating system, GPU, display tone mapping, and color-management path can each affect the visible result.

How to compare: Record the content, application, output mode, display preset, and whether the same detail changes in another trusted playback path. The browser canvas cannot determine a tone-mapping curve or display luminance.

✅ Next step: Follow the content application's and display manufacturer's calibration guidance. Confirm numeric brightness or curve behavior with appropriate measurement tools.

⚡ "Screen flickers or brightness jumps when enabling HDR"

What you observed: The screen blanked, flickered, or changed brightness during an output-mode or content change. Operating-system switching, application behavior, browser rendering, GPU/output settings, variable refresh, the connection, and display processing are possible influences; this page cannot isolate one cause.

How to compare: Record when the change occurs and keep the content, refresh setting, connection, OS mode, and display preset stable while changing one variable at a time. A brightness pulse does not verify local-dimming behavior or a display defect.

✅ Next step: Check current OS, GPU, and display documentation and firmware, then compare a stable supported configuration. Persistent real-world instability can justify manufacturer support or professional evaluation.