Cómo usar la herramienta «Comprobador de contraste de color»
- Introduce los dos coloresEscribe códigos HEX, como #1a1a1a o la forma abreviada #111, en Color del texto y Color de fondo.
- Ejecuta la comprobaciónPulsa Ejecutar para ver una vista previa del texto y la relación de contraste.
- Lee los resultados WCAGSe muestra Aprobado o No aprobado para Texto normal AA (4,5:1), Texto grande AA (3:1), Texto normal AAA (7:1) y Texto grande AAA (4,5:1).
Usos habituales
- Comprobar el texto de un botón sobre un color de marca
- Probar un texto gris claro antes de publicar
- Documentar el contraste para una revisión de accesibilidad
Preguntas frecuentes
¿Cómo se usa la herramienta «Comprobador de contraste de color»?
1. Introduce los dos colores: Escribe códigos HEX, como #1a1a1a o la forma abreviada #111, en Color del texto y Color de fondo. 2. Ejecuta la comprobación: Pulsa Ejecutar para ver una vista previa del texto y la relación de contraste. 3. Lee los resultados WCAG: Se muestra Aprobado o No aprobado para Texto normal AA (4,5:1), Texto grande AA (3:1), Texto normal AAA (7:1) y Texto grande AAA (4,5:1).
¿Cómo se calcula la relación?
Con la fórmula de luminancia relativa de WCAG, (L1 + 0.05) / (L2 + 0.05), donde L1 es el color más claro. La relación se muestra truncada a dos decimales, y el resultado usa el valor exacto, así que 4.499:1 no supera AA aunque esté cerca de 4.5.
¿Qué niveles WCAG se comprueban?
AA para texto normal a 4.5:1, AA para texto grande a 3:1, AAA para texto normal a 7:1 y AAA para texto grande a 4.5:1.
¿Puedo introducir valores RGB o nombres de colores?
No. Ambos campos necesitan códigos HEX de seis cifras o la forma abreviada de tres; el signo # es opcional.
¿Se guardan mis colores?
Los dos códigos HEX se envían al servidor de GigaTools, que calcula la relación y te devuelve el resultado. No se guarda nada.