coloraide icon indicating copy to clipboard operation
coloraide copied to clipboard

Do we need to match CSS achromatic threshold?

Open facelessuser opened this issue 10 months ago • 4 comments

Recently, we made a change to scale achromatic threshold by order of magnitude. This means that a color that scales achromatic chroma roughly, not precisely, between 0 - 1 would have an achromatic threshold of 1e-6 vs a color that scales in the 100s which would be 1e-4.

CSS seems to be proposing an approach that may make it into the actual CSS spec that wants to use the reference range divided by 100,000. This isn't too dissimilar to what we are doing now as though it is a much more relaxed threshold which will yield a an epsilon of 1e-3 for 0 - 100 and 1e-5 for 0 - 100.

Additionally, the CSS approach is a little arbitrary in the sense that it is based on the reference range of the space. For instance, lab-like spaces are not all using the same reference gamut, so spaces like JzCzhz is scaled to look for an achromatic threshold relative to Rec. 2100 and LCh is scaled to look for an achromatic threshold relative to display-p3.

As an example, if using the CSS proposed approach, you are looking to see if chroma is below 0.0015 in LCh using a Display-P3 gamut as reference. If we were to use Rec2020 as the reference (which CSS doesn't), you would have a threshold of 0.00195. Not a huge difference, but a difference.

Our current approach tightens the threshold, but does so with the only caring about the order of magnitude of the values, and less about the precise range of a reference gamut.

I suspect this may be an area of CSS we care very little about, but something we should at least formally make a decision about.

facelessuser avatar Mar 27 '25 15:03 facelessuser

It also seems, but maybe I am wrong, that polar spaces in CSS use their own chroma range and rectangular spaces will use the rectangular components to calculate the threshold. For a lab-like space, you can get colors that appear achromatic in the rectangular space, but do not appear achromatic in the polar space. This goes well beyond floating point differences. I would expect some differences between different color spaces, but not between polar and rectangular versions of the same space. It is possible that my interpretation is incorrect though.

facelessuser avatar Mar 27 '25 17:03 facelessuser

I do want to clarify that I'm not saying our approach is inherently better.

CSS's approach is trying to scale the achromatic based on the different chroma range of the space. In a way it does a better job as one Lab like space may squeeze chroma more than others, but it's only based on the max chroma of the space for a an arbitrary gamut, which may differ depending on what space we are talking about (SDR vs HDR). The actual range of chroma is going to be dependent upon the hue, so it's not a perfect representation of the range of a specific hue.

Our approach just scales ranges in the ballpark of ones smaller, than chroma in the ballpark of 100s. We aren't bothering with the max chroma of the arbitrary gamut, but we also don't account for spaces that may compress chroma to a greater or lesser degree. Additionally, we require a tighter approximation near zero, but that's a subjective choice as well.

I don't think one approach is necessarily better than the other per se, but I do think the polar version should match the rectangular version as far as achromatics go.

facelessuser avatar Mar 27 '25 18:03 facelessuser

It may be that CSS is based solely on chroma range. I may have misinterpreted the proposal in the conversation. That would be better.

facelessuser avatar Mar 28 '25 04:03 facelessuser

After referencing Color.js, which is often used as a prototype for the CSS spec, it appears they are in fact using Lab reference ranges for LCh achromatic thresholds. I generally disagree with this approach. It seems odd to use the rectangular a and b difference as the scaling of the threshold of how close chroma is to zero. It makes way more sense to use the chroma reference range to scale the chroma threshold. I realize a and b are essentially chromatic components of the rectangular space, but you get a more accurate range if you measure it directly in chroma. I much rather use LCh chroma to scale the achromatic threshold and check the Lab space by converting a and b to chroma.

For spaces like CAM16 who's default form is a polar form, there are no rectangular references to draw off of, not would it make sense to synthesize rectangular references just so we can scale a polar component threshold with it.

I think that is my personal preference and I'm leaning towards not caring what CSS does in this regard. If we go this route, it does mean we will not be mimicking CSS exactly unless they rethink their approach. I'm also not sure I want to loosen our achromatic threshold, but I would be more willing to do that than using the rectangular references to scale a polar component.

facelessuser avatar Mar 28 '25 22:03 facelessuser