-
Notifications
You must be signed in to change notification settings - Fork 2.2k
css.types.color.oklab and css.types.color.oklab: Browsers are not spec compliant, support is only partial. #26838
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Comments
Thanks for reporting, and please make sure to follow our Community Participation Guidelines to ensure respectful collaboration. We're currently in the process of adding general BCD guidelines for We can capture spec changes (or aspects) in a behavioral subfeature though. @pygy Would you suggest to capture support for "Gamut mapping" as a subfeature, or specific behaviors like "Maps lightness of 0% or 100% to black and white"? |
I hope that denouncing ablism (systemic or otherwise) doesn't break the guidelines. Apologies if I crossed a line. The proposed criteria are exactly part of what I was thinking about when mentioning the systemic aspects of the issue. They make sense in isolation, but combined with other factors, they perpetuate the problem. I'll chime in over there. Flouting accessibility should IMO be a deal breaker when it comes to considering a technology supported. Edit: also please note that the respective issues in the trackers are still open, meaning that implementors don't consider the issue as settled. I don't think splitting (e.g. black/white, and other colors) this would make sense, as this goes beyond white/black. Per spec, browsers should do with out of gamut colors, to preserve the contrast: ![]() Currently they do this ( ![]() OKLab is future-proof, in that it supports all possible future display technologies better gamut that we have now, but it lets authors specify colors that are wildly out of the supported range. The current algo leads to contrast compression. We end up with this (imagine this is a Web page with text, note that the flowers are ~uniform): When we could have this with proper mapping: Images source : https://bottosson.github.io/posts/gamutclipping/ , except for the schema that illustrates RGB clipping, which is mine. |
Thanks for sharing the visualisation.
Can you link and cite the relevant extract from the spec that describes the clamping as you expect it? |
Issues around gamut mapping came up in the process of combining these keys into a feature for web-features. There's a rather long discussion on it, but the interesting part for BCD starts with web-platform-dx/web-features#674 (comment) through the end of that PR. At the time the oklab feature shipped in browsers, implementers disagreed about what the spec required and so implemented clamping behavior as a substitute (at the time there was debate about whether this was allowed by the spec, so Philip and I couldn't even say that the clamping behavior was non-standard or not). Today, it's a little more clear cut: the clamping behavior is compatible but non-standard. Resolving #22646, with notes or by creating a non-standard behavioral subfeature, would cover some of the matters described here in this issue. As far as I can tell, there are no implementers of the latest specification text that actually calls for full gamut mapping, so there's probably nowhere to describe anything as partially implemented (until one browser does implement the new text, at which point the other implementers would become retroactively partial). Notes would be nice though! |
Thanks, Daniel. @pygy Would you like to update your PR to use either a non-standard behavioral subfeature for "Gamut clamping", or |
Uh oh!
There was an error while loading. Please reload this page.
What type of issue is this?
Incorrect support data (see below)
What information was incorrect, unhelpful, or incomplete?
The way browsers currently implement OKL* color spaces is not spec compliant and detrimental to accessibility.
The OKLab and OKLch color spaces have been designed with wide gamut and accessibility in mind, but the implementors skipped the accessibility aspects of the spec.
OKL* color spaces let users specify colors that are beyond what current displays are able to render.
In these situations, the spec says that the colors should be mapped using a specific algorithm that preserves the luminance and does its best to approach the saturation and chroma.
With a proper implementation, this lets authors design pages with a contrast between the text and the background that remains the same, no matter what display their users use.
With the current implementation, bad surprises are bound to happen.
https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/oklch is also concerned by this issue.
What browsers does this problem apply to, if applicable?
Chromium (Chrome, Edge 79+, Opera, Samsung Internet), Firefox, Safari
What did you expect to see?
I expect to see the current implementations marked as partially compatible, as they didn't implement OKL*, but a ShittyL* color space that is not accessible, but squats the name of the accessible one.
I expect to see a warning about these accessibility issues that discourages authors from using these color spaces or tells them to thread carefully when using them (staying in the sRGB gamut).
Did you test this? If so, how?
Visit https://vasilis.nl/dingen/bugs/oklch.html
The squares should be white and black per spec, they aren't in any browser.
Can you link to any release notes, bugs, pull requests, or MDN pages related to this?
Do you have anything more you want to share?
This is such a perfect example of systemic discrimination at work.
A system designed to be accessible ends up being implemented with poor accessibility and usability by one big actor, and everyone follows suit because it's easier.
MDN URL
https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/oklab
MDN metadata
MDN page report details
css.types.color.oklab
The text was updated successfully, but these errors were encountered: