# Resolutor de nombres de color CSS Resuelve cualquier color hex a su color CSS con nombre más cercano con distancia CIEDE2000 real, y explora toda su familia de color. > Página canónica: https://elysiatools.com/es/tools/css-color-name-resolver - **Categoría:** Design - **Palabras clave:** nombre color css, color más cercano, delta e, ciede2000, familia de color, hex a nombre ## Descripción general Basado en la lista completa de palabras clave de CSS Color Module Level 4 (148 palabras clave, 139 colores distintos, con los alias gray/grey, aqua/cyan y fuchsia/magenta unificados). La distancia usa CIEDE2000 (formulación Sharma/Wu/Dalal 2005 con los casos especiales de envoltura de tono de 180°) vía sRGB → RGB lineal → XYZ(D65) → CIELab; las webs clásicas usan distancia RGB pura, que clasifica mal los azules oscuros: cambia la métrica y verás cambiar el ranking. La vista de familia agrupa los 139 colores en 12 familias de diseño mediante umbrales HSL. Regla rápida de ΔE: <1 imperceptible, 1–2 apenas perceptible, 2–10 evidente, ≥50 colores opuestos. ## Entradas - **Color (hex o nombre CSS)** (text): #3366ff or cornflowerblue - **Métrica de distancia** (select) - **Modo de resultado** (select) - **Cantidad de coincidencias** (number) ## Cuándo usarlo - Al buscar una palabra clave CSS con nombre estándar que reemplace o documente un valor hexadecimal arbitrario. - Al auditar y agrupar colores de una interfaz dentro de familias cromáticas consistentes mediante umbrales perceptuales. - Al comparar la precisión de distancia perceptual entre CIEDE2000, CIE94, CIE76 y la distancia euclidiana RGB clásica. ## Cómo funciona - Introduce un código de color en formato hexadecimal (por ejemplo, `#f4a460`) o un nombre CSS ya existente. - Selecciona la métrica de cálculo de distancia deseada (CIEDE2000, CIE94, CIE76 o distancia RGB) y la cantidad de coincidencias a mostrar. - Elige entre el modo de colores más cercanos para obtener un listado ordenado por diferencia ΔE o el modo familia para ver todos los colores CSS de la misma categoría cromática. - Revisa la lista con los valores calculados de ΔE, la vista previa del color y las equivalencias directas para tus estilos. ## Casos de uso - Definición de tokens de diseño semánticos a partir de colores corporativos. - Refactorización y simplificación de hojas de estilo CSS legacy sustituyendo hex por nombres estándar legibles. - Exploración de paletas armónicas buscando alternativas dentro de la misma familia cromática. ## Preguntas frecuentes ### ¿Qué representa el valor ΔE (Delta E)? Es la medida de diferencia perceptual entre dos colores. Un valor menor a 1 es imperceptible a simple vista, entre 1 y 2 es apenas perceptible, entre 2 y 10 es evidente y valores superiores a 50 corresponden a colores opuestos. ### ¿Por qué usar CIEDE2000 en lugar de distancia RGB? La distancia RGB calcula distancias geométricas simples que fallan con azules oscuros y tonos casi neutros. CIEDE2000 modela la percepción visual humana convirtiendo sRGB a CIELab con corrección de tono y luminosidad. ### ¿Cuántos colores con nombre incluye la herramienta? Incluye las 148 palabras clave definidas en CSS Color Module Level 4, que representan 139 colores únicos tras unificar alias como aqua/cyan, fuchsia/magenta y gray/grey. ### ¿Cómo funciona el modo familia? Agrupa los 139 colores CSS en 12 familias de diseño (como marrón, azul o violeta) mediante umbrales HSL y lista todos los miembros de esa familia ordenados por cercanía a tu color. ### ¿Puedo introducir un nombre CSS como color de entrada? Sí, el campo acepta tanto valores hexadecimales como nombres CSS válidos para resolver sus variantes y colores más próximos. ## Herramientas relacionadas - [Conversor de color CMYK](https://elysiatools.com/es/tools/cmyk-converter): Convierte colores entre HEX, RGB, HSL y CMYK. - [Tonedor Sepia](https://elysiatools.com/es/tools/color-sepia-toner): Aplicar efectos de tono sepia a los colores con estilos clásico, cálido, frío y personalizado - [Convertidor de espacios de color](https://elysiatools.com/es/tools/color-space-converter): Convierte colores entre HEX, RGB, HSL, CIELAB y Display-P3 con salida CSS y control de gama. - [Herramienta de Colores Complementarios Divididos](https://elysiatools.com/es/tools/color-split-complement): Crear contraste harmonioso con esquemas de colores complementarios divididos usando un color base y dos colores adyacentes a su complemento - [Conversor de Color OKLCH](https://elysiatools.com/es/tools/oklch-color-converter): Convierte entre HEX, RGB, HSL, OKLCH y Display-P3 con la matemática de CSS Color 4, con lectura de luminosidad/croma/tono, comprobación de gamut sRGB y Display-P3, y sugerencia de recorte fuera de gamut - [Convertidor Adobe RGB a CMYK](https://elysiatools.com/es/tools/adobe-rgb-to-cmyk-converter): Convertir valores de color Adobe RGB a formato CMYK para impresión con soporte de canal alfa - [Convertidor Adobe RGB a HEX](https://elysiatools.com/es/tools/adobe-rgb-to-hex-converter): Convertir valores de color Adobe RGB a formato HEX para diseño web - [Convertidor Adobe RGB a HSL](https://elysiatools.com/es/tools/adobe-rgb-to-hsl-converter): Convertir valores de color Adobe RGB a formato HSL para trabajo de diseño ## Ejemplos - [Ejemplos de Códigos de Color](https://elysiatools.com/es/samples/color-code): Colección de códigos de color en varios formatos (Hex, RGB, HSL, colores con nombre) para pruebas de validación - [Ejemplos de Procesamiento de Imágenes Web Python](https://elysiatools.com/es/samples/web-image-processing-python): Ejemplos de procesamiento de imágenes Web Python usando PIL/Pillow incluyendo lectura, guardado, redimensionamiento y conversión de formato - [Ejemplos del Framework CSS Bulma](https://elysiatools.com/es/samples/bulma): Ejemplos del framework CSS Bulma incluyendo columnas, componentes, controles de formulario, sistema de diseño y patrones de diseño modernos basados en CSS - [Ejemplos de Selectores CSS](https://elysiatools.com/es/samples/css-selectors): Colección de ejemplos de selectores CSS para pruebas de extracción y análisis ## Contenido relacionado - [Herramientas de conversion de espacios de color para web e impresion](https://elysiatools.com/es/hubs/design-convert): Herramientas reunidas para conversion de espacios de color entre web e impresion en un solo hub. - [Generadores de efectos CSS, paletas y tokens de diseno](https://elysiatools.com/es/hubs/design-generate): Herramientas reunidas para efectos visuales CSS, construccion de paletas y generacion de tokens de diseno en un solo hub. - [Herramientas de auditoria de accesibilidad web y color accesible](https://elysiatools.com/es/hubs/web-accessibility-audits): Revisa problemas WCAG, orden de lector de pantalla, fallos de contraste, riesgo de vision cromatica y elecciones de color accesible en un solo hub para flujos de accesibilidad web. - [Herramientas de Diseño de Color y Conversión de Espacios de Color](https://elysiatools.com/es/hubs/color-design-tools): Comparar convertidores de color, generadores de paletas, herramientas de armonía, verificadores de accesibilidad y utilidades de ajuste de color en un solo lugar para diseñadores y desarrolladores.