CSS: ¿Por qué DarkGray es más luminoso que Gray?

El estándar CSS define el color "Gray" (gris) más oscuro que "DarkGray" (gris oscuro), mientras que "LightGray" (gris claro) es, como era de esperar, más claro que estos otros dos tonos. ¿Como puede ser? Me gustaría responder a esta pregunta en esta información.

En resumen: Esta peculiaridad del estándar CSS tiene, como suele ocurrir en tales circunstancias, razones históricas para mantener la compatibilidad.

Los Colores

En concreto se trata de los siguientes colores de los estándares HTML 3.2 y X11, que forman la base de los colores CSS3:

HTML 3.2 y CSS 1

Inicialmente, el estándar HTML sólo contenía 16 nombres de colores diferentes. Estos eran los "Colores VGA" introducidos con HTML 3.2 y CSS 1, que básicamente correspondían a los colores básicos con algunas gradaciones rudimentarias.

Además de "Black" (negro) y "White" (blanco), este estándar solo contenía "Gray" (gris) definido con el valor RGB #808080 así como "Silver" (plata) definido con #C0C0C0, pero no había nombres de colores para gris claro o gris oscuro.

Desarrollo de CSS 3

Esto cambió con CSS 3. El World Wide Web Consortium W3C quería admitir más nombres de colores y esa lista ya existía en ese momento: los nombres de colores X11, lanzados en junio de 1986 y ampliados hasta 1989 para incluir más colores, casi hasta el nivel actual. Esta lista de colores fue compilada para el X Window System (software Unix para crear interfaces gráficas de usuario) y contenía más de 100 nombres de colores diferentes. Al mismo tiempo, estos nombres de colores también fueron compatibles con algunos primeros navegadores, como Mosaic y Netscape Navigator, ya que ambos programas se desarrollaron inicialmente como aplicaciones X. Además, la lista era de código abierto. En realidad, las condiciones ideales para una adopción en el estándar CSS.

Sin embargo, desafortunadamente, hubo un pequeño problema: los colores X no se podían adoptar simplemente uno a uno, ya que algunos de los colores se definían de manera diferente que en el antiguo estándar CSS1, que ya era compatible. Y, por supuesto, el nuevo estándar CSS tenía que seguir siendo compatible con el antiguo.

X11 definió DarkGray como #A9A9A9 (66%), Gray como #BEBEBE (75%) y LightGray como #D3D3D3 (83%), mientras que el estándar anterior no conocía ni DarkGray ni LightGray, pero definió Gray como #808080 (50%), por lo que más oscuro que el DarkGray de X11. Por lo tanto, X11 era internamente consistente y definió "gris oscuro" más oscuro que "gris" y "gris claro" más claro que "gris", pero esto no era consistente con el valor ya definido de "gris".

El blanco (White) y el negro (Black), por otro lado, no causaron ningún problema, ya que ambos colores ya estaban incluidos en ambos estándares y estaban definidos de la misma manera con #000000 y #FFFFFF respectivamente.

El Compromiso

Dado que el consorcio quería adoptar tantos colores de X11 como fuera posible (también porque algunos navegadores ya trabajaban con estos colores), pero al mismo tiempo no querían contradecir el estándar existente, el consorcio decidió adoptar DarkGray y LightGray de X11 con exactamente la definición de X11, pero conservando al mismo tiempo la antigua definición de Gray.

Como resultado de este compromiso, ahora tenemos que vivir con el hecho de que, contrariamente a lo esperado, "gris" en el estándar CSS es más oscuro que "gris oscuro", respectivamente, que "gris" en su brillo no se encuentra entre "gris oscuro" y "gris claro", como cabría esperar.

Otros Valores y Nombres de Gris

Puede encontrar más valores de gris definidos por el estándar CSS, así como información adicional sobre este tema, incluidas tablas de colores, en mi artículo sobre valores de gris.