◐

Verificador de contraste de color

Comprueba la relación de contraste WCAG entre un color de texto y de fondo con resultados AA/AAA.

Tus archivos se quedan en este dispositivo

Los archivos se procesan en tu navegador, sin subirse a ningún servidor. El sitio descarga el código y los recursos necesarios. Sin cuentas ni rastreadores.

Usa Descargar para guardar esta herramienta como un archivo HTML y usarla sin conexión.

Privacidad →

Color del texto

Fondo

El veloz murciélago hindú comía feliz cardillo y kiwi.

Texto de muestra grande

Prueba un ejemplo resuelto

Ejemplo

Pon el color del texto en #767676 y el fondo en #ffffff. La relación es 4.54:1, que aprueba AA para texto normal. Un tono más claro, #777777, da 4.48:1 y suspende, porque AA exige al menos 4,5:1 para texto normal.

Ten en cuenta

El texto grande (unos 24px, o 18,7px en negrita) solo necesita 3:1 para AA. La relación no tiene en cuenta fuentes finas, texto sobre imágenes ni transparencias, así que revisa también el diseño real y no transmitas significado solo con el color.

Acerca de esta herramienta

Compara un color de primer plano y de fondo para ver la relación de contraste WCAG y si cumple AA y AAA, todo calculado localmente en tu navegador.

Preguntas frecuentes

¿Qué cuenta como texto grande?

WCAG considera grande el texto de 18pt (24px) o de 14pt (18,66px) en negrita, que requiere una relación menor de 3:1 para AA.

¿Qué relaciones aprueban?

El texto normal necesita 4,5:1 para AA y 7:1 para AAA; el texto grande necesita 3:1 para AA y 4,5:1 para AAA.