← Back to release summary

accent-color CSS property

Category
CSS
Type
Chromium catches up
Status
Enabled by default (Chrome 93)
Intent stage
Shipped

WPT details: We have several WPTs for the CSS semantics here: https://wpt.fyi/results/css/css-ui/accent-color-visited.tentative.html https://wpt.fyi/results/css/css-ui/accent-color-parsing.html https://wpt.fyi/results/css/css-ui/accent-color-computed.html https://wpt.fyi/results/css/css-typed-om/the-stylepropertymap/properties/accent-color.html https://wpt.fyi/results/css/css-ui/animation/accent-color-interpolation.html We also have pixel tests for the appearance, but these are platform and browser specific so I don't think I can make WPTs for them.

Summary

The accent-color CSS property allows the page to specify a color used by form controls instead of using the builtin default color. For example, "accent-color: red" on an <input type=checkbox> would change the blue color around the checkmark to red.

Motivation

A number of developers have indicated that they would prefer to be able to change the color of form controls. For example: https://bugs.chromium.org/p/chromium/issues/detail?id=1091531

Standards & signals

Ecosystem

Explainers: https://drafts.csswg.org/css-ui-4/#widget-accent

View on chromestatus.com