Greys are the wrong shade of grey

[xriss]

The 50% mid point between #f6f6f6 and #121212 is incorrectly listed as #848484 which is a naive sRGB blend. Half way between black and white in sRGB space is more of a #bababa grey.

"bababa grey sheep." isn't that a nice easy phrase to help remember where the sRGB grey point is?

So, when blending between two colours in sRGB space one must first convert to linear space, perform the blending and then convert back.

Obviously there are other ways to mix and represent colours but by far the most frequent errors come from sRGB being transformed in a linear way. The mid point is simply not where a naive person might assume it is, this can cause confusion and very very bad design choices.

Lets do the math...

in this case 0xf6 and 0x12 become, in linear space 0..1 values

(0xf6/0xff)^2.2 == 0.92399333525
(0x12/0xff)^2.2 == 0.00293231832

NB: sRGB is technically more complex but ^2.2 is a generally accepted approximation.

The mid point of these numbers is of course 0.46346282678 and converting that back into sRGB space gives us

(0.46346282678^(1/2.2))*0xff == 179.774783392 == 0xb4

So in this example --color-grey-50 should be more of a #b4b4b4 when you have it listed as #848484

Quite a big error.

[snip]

And: all other blended colours are also wrong for the same reasons.

[stevieflow]

Thanks for sharing this @xriss - I'm sure we can take a look and rectify

To note - I edited the OP to just focus on the issue rather than the people. Thanks