[csswg-drafts] [css-color-5] Define the behavior of missing channels in the relative color syntax (#7771)

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

== [css-color-5] Define the behavior of missing channels in the relative color syntax ==
The [relative color syntax in level 5](https://drafts.csswg.org/css-color-5/#relative-colors) allows existing colors to be modified using the color functions. For example, we can start with a base color `green`, and manipulate it in `lch` space, by performing calculations on the `l`, `c`, and `h` channels:

```css
/* example from the spec */
html { --color: green; }
.foo {
  --darker-accent: lch(from var(--color) calc(l / 2) c h);
}
```

This syntax predates the specification of [missing color components in level 4](https://drafts.csswg.org/css-color-4/#missing), represented by the `none` keyword. While the addition of `none` to the function syntax has been ported into level 5, it's not clear how this should interact with the relative color syntax. 

**What should happen when the base color has a missing component, and the relative syntax performs a calculation on that channel?**

```css
html { --color: lch(0.5 0.5 none); }
.foo {
  --complement: lch(from var(--color) l c calc(h + 180deg));
}
```

I see three basic options:

1. **Invalid operation**. This seems like the 'default' if we don't specify something different, since `none` is clearly not a valid number for `calc()`. However, I think it's not a very useful behavior, and we should avoid it if possible. In general, it seems bad to say 'some valid colors will simply break if you adjust them' - especially since `none` can result from internal CSS operations.

2. **Calculate with `0` in place of `none`**. This may be the most obvious choice, since it matches the behavior in other cases where we need a number value for `none`. But the results aren't necessarily useful, especially when the channel is truly powerless.

3. **The result is always `none`**. This was proposed by @nex3 as it maintains the intent of `none` to represent powerless or unimportant channels. Rotating a missing/powerless hue results in a hue that is still missing/powerless.

I'd propose that we go with option 3, but I could see arguments for the other approaches. Thoughts?

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


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Tuesday, 20 September 2022 21:42:16 UTC