Cómo funciona
Escribe un color en cualquier formato habitual o usa el selector. Obtienes el mismo color en HEX, RGB, HSL y CMYK, su relación de contraste con texto blanco y negro junto con el nivel WCAG correspondiente, y una fila de tonos más claros y más oscuros que puedes tocar para explorar.
Relación de contraste = (L1 + 0,05) ÷ (L2 + 0,05), donde L es la luminancia relativa
Cómo leer los niveles de contraste
- AAA (7:1 o más): legibilidad excelente para el texto principal.
- AA (4,5:1 o más): el mínimo para texto normal en sitios web.
- AA grande (3:1 o más): solo para títulos grandes o en negrita e iconos.
- Menos de 3:1: difícil de leer para muchas personas.
Consejos
- Los valores CMYK son una conversión sencilla; las imprentas usan perfiles de color, así que revisa una prueba para obtener los colores exactos de impresión.
- El HEX de 8 dígitos y rgba() incluyen transparencia.
- Haz clic en cualquier valor para copiarlo.
Criterios y fuentes
- Los valores de color siguen CSS Color Module Level 4 (sRGB)
- Las relaciones y niveles de contraste siguen las WCAG 2.2 (W3C)
Última revisión 7 de octubre de 2026
Preguntas frecuentes
¿Cómo convierto HEX a RGB?
Escribe el código HEX, por ejemplo #ff6600, y el valor RGB aparece al instante: rgb(255, 102, 0) en este caso.
¿Qué relación de contraste necesito?
Las WCAG exigen al menos 4,5:1 para texto normal (AA) y 7:1 para el nivel AAA, más estricto. Los títulos grandes necesitan 3:1.
¿Los valores CMYK son exactos para imprimir?
Son una conversión matemática directa. La impresión real depende de los perfiles de papel y tinta, así que confírmalo con una prueba.
¿Admite transparencia?
Sí. Los valores HEX de 8 dígitos, rgba() y hsla() conservan su canal alfa.
¿Cómo copio un valor?
Haz clic en cualquier valor HEX, RGB, HSL o CMYK para copiarlo, o usa el botón de copiar para copiarlos todos a la vez.