[css-color-adjust-1] Root non-overlay scrollbars used color scheme

[yshalivskyy]

WebKittens

No response

Title of the spec

CSS Color Adjustment Module Level 1

URL to the spec

https://www.w3.org/TR/css-color-adjust-1/

URL to the spec's repository

No response

Issue Tracker URL

No response

Explainer URL

No response

TAG Design Review URL

No response

Mozilla standards-positions issue URL

mozilla/standards-positions#995

WebKit Bugzilla URL

No response

Radar URL

No response

Description

Problem statement

Many web pages don't specify the support for light/dark color schemes using CSS "color-scheme" property or meta tags. In such a case, the used color scheme is light for scrollbars and other interactive UI elements despite the user preference set on the browser/OS level. Although the behavior is expected for elements which are part of the web content, viewport non-overlay scrollbars always stay on the side of the page and are treated by users as a part of the browser UI. The current behavior confuses users who have selected dark mode and expect viewport scrollbars to follow their choice.

Proposed solution

The proposed solution is to make the browser use the user's preferred color scheme to render the viewport scrollbars if the value of "page’s supported color schemes" is 'normal' or not specified, and the computed value of the color-scheme for the root element is 'normal'. Viewport scrollbars can be considered to be outside the web content. Therefore, the user agents should honor the user's preferred color scheme when rendering viewport scrollbars if page authors have not explicitly specified support for color schemes.

Bugs tracking this feature

Chromestatus: Used color scheme root scrollbars - Chrome Platform Status (chromestatus.com)
Chromium: Make root viewport non-overlay scrollbars follow the user's preferred color scheme by default [40259909] - Chromium
CSSWG issue: [css-color-adjust-1] Root viewport non-overlay scrollbars should follow the user's preferred color scheme by default · Issue #8603 · w3c/csswg-drafts (github.com)