dynamic-range media queryBaseline · Widely available
The dynamic-range CSS media query sets styles based on whether a device can display at least standard range colors or at least high range colors. Non-visual devices will match neither.
Supported in all major browsers for at least 30 months — safe to use without fallbacks. Baseline since May 3, 2022. Widely available since Nov 3, 2024.
Browser support
DesktopChrome
1–97Not supported
98+Supportedsince Feb 1, 2022
Current: 155Edge
12–97Not supported
98+Supportedsince Feb 3, 2022
Current: 154Firefox
1–99Not supported
100+Supportedsince May 3, 2022
Current: 157Safari
1–13Not supported
13.1+Supportedsince Mar 24, 2020
Current: 27MobileChrome Android
18–97Not supported
98+Supportedsince Feb 1, 2022
Current: 155Firefox Android
4–99Not supported
100+Supportedsince May 3, 2022
Current: 157Safari iOS
1–13Not supported
13.4+Supportedsince Mar 24, 2020
Current: 27How to use
This feature is Baseline widely available — use it freely, no fallback needed.
Example
Full syntax and examples are on MDN: dynamic-range.
Feature detection
There’s no simple runtime check for this feature; rely on the support table and test in your target browsers.