[csswg-drafts] Allow specifying the "accent color" of a form control element (#5187)

chrishtr has just created a new issue for https://github.com/w3c/csswg-drafts:

== Allow specifying the "accent color" of a form control element ==
(not sure which spec this might apply to - css-color-adjust? css-color? css-pseudo?)

Form controls often have a themed highlight color that indicates a "selected" state. For example, in Chromium, we recently changed the look and feel to have a blue highlight color:

<img width="271" alt="Screen Shot 2020-06-06 at 9 11 56 AM" src="https://user-images.githubusercontent.com/3453258/84091874-a4a48000-a9aa-11ea-94b7-5788767ed3e5.png">
<img width="217" alt="Screen Shot 2020-06-06 at 9 12 04 AM" src="https://user-images.githubusercontent.com/3453258/84091877-a706da00-a9aa-11ea-90ad-9c58710247a9.png">
<img width="187" alt="Screen Shot 2020-06-06 at 9 11 47 AM" src="https://user-images.githubusercontent.com/3453258/84091880-a9693400-a9aa-11ea-8dc0-4a2ee8ddbb96.png">
<img width="131" alt="Screen Shot 2020-06-06 at 9 11 42 AM" src="https://user-images.githubusercontent.com/3453258/84091886-abcb8e00-a9aa-11ea-9176-12452788ca65.png">

(Edge on Mac has similar styling to Chrome but does not use blue). [This demo](http://concrete-hardboard.glitch.me/) enumerates all of the form controls and can be tested on various browsers.

In addition, some operating systems, such as Mac OS X, allow changing the accent color via a user setting. Safari uses this setting to change the blue color in the screenshots above to a different color.

A number of developers have indicated that they would prefer to be able to change the color. See e.g. [this issue](https://bugs.chromium.org/p/chromium/issues/detail?id=1091531). I propose a way to do this via CSS:

* A new css property `accent-color` that would take on the usual color values. We would specify that a user agent *should* use this color to change the accent color of a UA-rendered form control, if there is such a well-defined concept for that form control; and otherwise this property has no effect. In the various accessibility and forced color modes, this property is ignored.

In general, form control styling and rendering is not specified, but this particular part of it seems like it can be.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/5187 using your GitHub account

Received on Tuesday, 9 June 2020 00:22:18 UTC