Skip to content

[css-color-4] Does interpolation with achromatic colors truly have a "longer" arc? #9436

@facelessuser

Description

@facelessuser

This question is in relation to the recently closed issue: #9224.

Based on the conversation there, it appears it was determined that Chrome was handling logic for interpolation with undefined hues correctly. So this question is to specifically clarify the point in the title.

I realize the original question was specifically asking about "transparent" colors, but the resolution there I believe translates to achromatic colors in general. My personal opinion is that the resolution leads to unexpected results.

Consider the following example which interpolates a red color with black.

linear-gradient(to right in oklch longer hue, oklch(0.628 0.26 29.23), oklch(0 0 none / 1));

Results in Chrome

Screenshot 2023-10-04 at 6 27 50 AM

https://codepen.io/facelessuser/pen/MWZPmwy

Because the undefined hue is resolved to inherit the hue of the red color before the hue fix-up, we now get an interpolation around the entire color wheel, as if there was an arc between black and red. The reality is that achromatic colors have no hue; therefore, they have no arc between any hue.

Based on the conversation in #9224, my understanding is that this is indeed "correct" for CSS, even though it seems unintuitive, at least to me.

While Safari may be wrong in its implementation, it seems intuitive. In their case, it seems the undefined hue is not resolved until after the hue fix-up.

Screenshot 2023-10-04 at 6 34 19 AM

So, this is simply to clarify whether this behavior, conceptually, is truly the intention of the CSS spec or not, outside of which browser implemented the spec correctly.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Closed as Question AnsweredUsed when the issue is more of a question than a problem, and it's been answered.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions