Media Queries: prefers-reduced-transparency feature

Category: CSS
Type: Chromium catches up
Status: Enabled by default (Chrome 118)
Intent stage: Prepare to ship

Summary

Adds the `prefers-reduced-transparency` feature, which lets authors adapt web content to user-selected preference for reduced transparency in the OS, such as the 'Reduce transparency' setting on macOS. Valid options are 'reduce' or 'no-preference'.

Standards & signals

Specification: https://drafts.csswg.org/mediaqueries-5/#prefers-reduced-transparency
Firefox: No signal — There is a separate umbrella issue for some the preference media queries (contrast, motion, color-scheme). They have a stale PR to add an overall positive position for those preference media queries. They also have an implementation behind a flag. It's not been enabled yet due to fingerprinting concerns.
Safari: No signal — I have submitted an implementation of this feature as a PR to WebKit: https://github.com/WebKit/WebKit/pull/11560
Web developers: Positive
Tracking bug: https://bugs.chromium.org/p/chromium/issues/detail?id=1424879

Samples: https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-transparency#examples

View on chromestatus.com