View transitions are the perfect candidate progressive enhancement. If the browser supports it, then the user will get the rich animations. If it doesn’t, then they get what they currently have.
And once other browsers starts supporting it, the experience will automatically work in those browsers too without you needing to touch a single line of code :)
> View transitions are the perfect candidate progressive enhancement.
Quite the opposite. The alternative to "no view transitions" isn't "clunky hard-refresh page-by-page experience," it's single-page view transitions orchestrated by JavaScript (instead of by Chrome). View transitions require you to fundamentally change the architecture of not just a page, but your entire website/app.
I may turn down the brightness on images, generally, in dark mode. (Using a filter).
And have some classes that mean “don’t alter the brightness of this image, in dark mode”
And there may be other images which I will invert the color of. For example any image that is basically black text on a white background — it’s better to invert it completely rather than just lower the brightness.
> This solves one tiny aspect of the larger problem in a non-scalable way that will inevitably lead to bloat and inflexibility. It's a really a naive approach that hasn't taken into account design at scale, nor the future of where design is heading.
Note that `light-dark()` isn’t the end goal here. As discussed within the CSS WG, the end goal is to have a generic function `schemed-value()` to give you what you want.
Yes, `light-dark()` is very specific in what it can do … but it’s not the end goal. The end goal is to have a generic function – something like `schemed-value()` – that can respond to a plentitude of `color-scheme` values and return more than just `<color>` values.
Reality is, though, that browsers don’t have support for custom `color-scheme` values (it’s explicitly forbidden in the spec, for now) [^1] and that CSS parsers need to know ahead of time what they are about to parse [^2].
By narrowing things down in feature scope, you can use this convenience method now, instead of needing to wait a few months/years until the rest is figured out.
Once `schemed-value()` becomes a thing, `light-dark()` can become syntactic sugar for it:
```
light-dark(<color>, <color>); = schemed-value(light <color>, dark <color>);
```
(Hi, author of the post here) `grey` is no accepted value for `color-scheme`, so that would make no sense.
Note that `light-dark()` is not the end station here, it’s a step towards a future function that (1) would be able to respond to any value for `color-scheme` and (2) can return any type of value.
And once other browsers starts supporting it, the experience will automatically work in those browsers too without you needing to touch a single line of code :)