Color for the color-challenged

This article mentions a notable limitation of the HSL colour model:

> Perceived brightness is not at all uniform at equal starting points, it depends on the hue, as well as the saturation.

…but it doesn't mention an (under-discussed) solution available: using a better colour model. OKLCH uses similarly understandable coordinates, "chroma" being roughly the same concept as "saturation", but is designed to avoid just this kind of problem. That is, if you change the "hue" coordinate, you can reasonably expect the perceived lightness and chroma of the resulting colour not to change. Where such a colour does not exist, e.g. a blue with the same lightness and chroma as #FFFF00 yellow, it's simply out of gamut.

There's a colour picker web app[0] that shows the boundaries of the space along with smaller spaces like sRGB, and it's helpful for getting a feel for it. It also links to a post[1] laying out the reasons to use OKLCH in web projects (it's now supported by all three major engines), and the post[2] introducing OKLAB (same space, different coordinate system) is heavy on technical details.

[0]: https://oklch.com/

[1]: https://evilmartians.com/chronicles/oklch-in-css-why-quit-rg...

[2]: https://bottosson.github.io/posts/oklab/

I realized belatedly that it's pretty easy to memorize by heart the RGB hex codes of the most common colors by deriving them from basic color theory. For example, what's the hex code for yellow? Well yellow is the complementary color of blue, and so hex(yellow) is just the ones' complement of hex(blue)=#0000FF, i.e, #FFFF00

Likewise, cyan is the complementary color of red, so hex(cyan) is the ones' complement of hex(red)=#FF0000, i.e. #00FFFF. This hex code also makes clear that cyan is produced by mixing equal amounts of green and blue light.

what about azure? azure is when you take cyan and and 'de-emphasize' its green component. So you just halve the green part of its hex code, to get #0080FF. If you instead halve the blue part, you get #00FF80 (spring green)

likewise, orange is when you take yellow (#FFFF00) and halve its green component, so: #FF8000.

And so on. Not every common color can be derived in this way, but you can go very far.

Apologies if this sounds completely defeatist, but wouldn’t it be better to just mostly get rid of colors in product design? That is, yes, you absolutely want to use color for branding and recognizability, but given the fact that widely deployed color models and accessibility metrics do not completely reflect the reality of human color perception, using them to convey information is just not worth the trouble.

Again, there are exceptions to everything, but WCAG 2.1 says UIs shouldn’t fully rely on color to convey information (please correct me if I am wrong), the same goes for icons.

I can see how other sectors and industries will treat this differently (think color bands on resistors or topographical maps), but for me, creating a SaaS product with a focus on accessibility, I have almost completely given up on this topic.

Charts, statistics and so on are way easier to make accessible when using good old HTML tables.

The increase in product quality is marginal when optimizing for color.

Such wealth of knowledge, hidden beneath the dark patterns of Medium. Sad, I'm the target audience but as soon as I saw the Medium nag screen, I'm out.

Thought this was about a cure for color blindness and now I’m disappointed