WPT details: Existing tests: https://wpt.fyi/results/css/css-color/light-dark-basic.html https://wpt.fyi/results/css/css-color/light-dark-currentcolor.html https://wpt.fyi/results/css/css-color/light-dark-inheritance.html To be added by Chromium implementation: https://wpt.fyi/results/css/css-color/light-dark-currentcolor-in-color.html
Allows authors to provide separate colors for light and dark color-schemes on a per element basis. System colors and UA form controls are rendered with different colors depending on the color-scheme set on an element. Authors can have the same possibility through the light-dark() function: #target { background-color: light-dark(lime, green); } The #target element will have a green background if the used color-scheme for the element is 'dark'. Otherwise, the background will be lime.