Intent to Prototype: Support currentcolor in Relative Color Syntax

59 views

Skip to first unread message

Kevin Babbitt

unread,

Jul 11, 2024, 12:48:54 PM (4 days ago) Jul 11

to blink-dev

Contact emails

kbab...@microsoft.com

Explainer

None

Specification

https://www.w3.org/TR/css-color-5/#resolving-rcs

Design docs

https://docs.google.com/document/d/1568wVjrIRbrU9_O37gPu10cj0CDWRiAc6ZMk9t0JpXs/edit

Summary

Allow relative colors in CSS (using the 'from' keyword) to use 'currentcolor' as a base. This will make it easy for web developers to set complementary colors, based on an element's text color, for that element's borders, shadows, backgrounds, etc.

Blink component

Blink>CSS

Motivation

Relative Color Syntax was selected for Interop 2024 with a large fraction of non-passing tests covering use of currentcolor. Without this feature, web developers have to resort to sub-optimal workarounds such as passing the base color in a CSS Variable.

Initial public proposal

None

TAG review

https://github.com/w3ctag/design-reviews/issues/894

TAG review status

Satisfied. The link above is for Relative Color Syntax in general. Tests for currentcolor cases were added as part of the discussion before the TAG signed off on the review; I interpret that to mean that they're satisfied with this use case.

Risks

Interoperability and Compatibility

Interoperability: Relative Color Syntax is a focus area for Interop 2024, and inclusion of currentcolor is well covered by existing WPTs, so the risk of other engines not converging on an interoperable implementation is low.

Compatibility: The only risk here is that enabling currentcolor support will "light up" color declarations that are being rejected at present. Total usage of Relative Color Syntax on the Web (including currentcolor or otherwise) is ~0.09% of page loads as of May 1, 2024[1]. I haven't done an analysis of currentcolor in RCS, but given that no major engine supported it as of that date, I would expect it to be a tiny fraction of those.

[1] https://chromestatus.com/metrics/feature/timeline/popularity/4632

Gecko: Positive (https://github.com/mozilla/standards-positions/issues/841) Implementation bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1893966

WebKit: Shipped/Shipping (https://bugs.webkit.org/show_bug.cgi?id=245970) Changes landed May 13.

Web developers: Positive (https://github.com/web-platform-tests/interop/issues/426) This feature is part of Interop 2024.

Other signals: