A Tidbit of Computer Science History

Why Dark Gray is Brighter than Gray In CSS

You’ve might not have noticed this as it’s a very subtle bit of trivia but in your browser there are pre-defined colors which aren’t what they seem. If I were to tell you that the swatches above are named light-gray, gray and dark-gray could you place the names with the color swatches?

Now, to be fair I’ll admit that was a trick question but why is the dark-grey a lighter shade than gray?

Well basically it boils down to the a bit of legacy awkwardness. The first versions of Mosaic and Netscape Navigator were X Applications, meaning they used the X Windows System on UNIX which defines a set of normalized color names which the browsers pulled in.

Eventually the World Wide Web Consortium (W3C) moved to standardize and merged in the X11 color set, but there were some clashes with what the specification wanted.

In HTML “gray” was reserved for the 128 triplet (as in 50%) gray while X11 defined “gray” as a shade around 75% gray which meant since it was reserved it became a shade of 50% gray throwing away the X11 color value.