Buscador de Colores CSS Nombrados | Diccionario bidireccional de los 148 colores estándar de CSS
Diccionario para desarrolladores que recorre los 148 colores nombrados definidos en el CSS Color Module Level 4. Busca por nombre y obtén las representaciones hex / RGB / HSL / OKLCH, o introduce cualquier hex y descubre el nombre CSS más cercano según la distancia perceptual ΔE en OKLab. Te ayuda a decidir si un color del sistema de diseño puede expresarse como palabra clave CSS o conviene mantener el hex personalizado.
💡 Sobre esta herramienta
Los 148 colores con nombre de CSS (steelblue, cornflowerblue, lightgoldenrodyellow, etc.) son un vocabulario heredado del archivo rgb.txt de X Window System, incorporado a SVG 1.0 y estandarizado en el CSS Color Module. La mayoría de los desarrolladores depende del autocompletado del editor, que falla con nombres largos como lightgoldenrodyellow o mediumspringgreen, y abrir MDN cada vez rompe el flujo de diseño.
Aquí el campo de entrada tiene autocompletado integrado: al escribir light aparecen lightcoral, lightskyblue y demás candidatos, y al seleccionar uno se rellenan simultáneamente las notaciones hex, RGB, HSL y oklch(). En sentido inverso, pega cualquier hex y la herramienta calcula el nombre CSS perceptualmente más cercano con los coeficientes OKLab de Björn Ottosson. La distancia ΔE en OKLab refleja la percepción humana mucho mejor que la distancia euclidiana en sRGB, así que la sugerencia "color más cercano" coincide con lo que ve tu ojo — útil para decidir si #5e8aaf está suficientemente próximo a steelblue como para enviarlo con esa palabra clave.
🧐 Preguntas Frecuentes
Q. ¿Cuántos colores nombrados tiene CSS?
A. 148, definidos formalmente en CSS Color Module Level 4 (Sección 6.1). Si cuentas las variantes ortográficas gray/grey por separado, la superficie llega a 157, pero la paleta sRGB subyacente son 148 valores distintos.
Q. ¿Por qué existe rebeccapurple (#663399)?
A. El CSS Working Group lo añadió en 2014 en memoria de Rebecca Meyer, hija del autor de CSS Eric Meyer. Es uno de los pocos colores con una historia humana explícitamente documentada en la especificación.
Q. ¿gray y grey son el mismo color?
A. Sí. Nueve palabras clave de la familia gris (gray, darkgray, lightgray, dimgray, slategray, lightslategray, darkslategray y compuestos) tienen alias con la grafía grey que comparten exactamente el mismo valor hex, conservados por razones históricas.
Q. ¿Por qué usar OKLab ΔE para el nombre más cercano? A. La distancia euclidiana en sRGB se aparta mucho de la percepción humana, sobre todo en regiones oscuras y saturadas: dos colores equidistantes en RGB pueden verse idénticos o muy distintos. OKLab, publicado por Björn Ottosson en 2020, es un espacio de color perceptualmente uniforme donde la distancia en línea recta aproxima la diferencia percibida.
Q. ¿Puedo introducir RGB, HSL u OKLCH directamente? A. Por ahora no. Los modos de entrada aceptan solo nombres CSS y códigos hex. RGB, HSL y OKLCH se muestran únicamente en la salida; convierte primero tus valores a hex.
Q. ¿La notación oklch() se puede usar realmente en CSS?
A. Sí. oklch(L% C H) forma parte de CSS Color Module Level 4 y ya está disponible en las versiones actuales de Chrome, Safari y Firefox. Se adopta cada vez más en sistemas de diseño con gamut ampliado (Display P3 o Rec.2020).
📚 Datos Curiosos
La lista de colores con nombre de CSS se remonta al archivo rgb.txt que se distribuía con X Window System a mediados de los años 80, donde investigadores y programadores gráficos asignaban nombres a mano. Nombres caprichosos como mediumaquamarine, papayawhip o peachpuff son fósiles de aquella época, la sensibilidad de algún autor de temas X11 hace décadas, ahora congelada en la plataforma web porque el CSS Working Group decidió preservar el conjunto histórico en lugar de podarlo.
Que el vocabulario textil de los 80 (burlywood = corteza de árbol, gainsboro = apellido de un pintor inglés del siglo XVIII) conviva en la misma especificación con la notación moderna oklch() convierte la sección de color de CSS en uno de los pocos documentos de la plataforma web que abarca 40 años de historia informática en 200 líneas.