Color y diseño

Comprobador de contraste de texto

Compara dos colores HEX opacos con los umbrales de contraste de texto WCAG.

Procesado de forma local

Comprueba solo el contraste del texto, no toda la accesibilidad. Solo colores sólidos opacos; sin transparencia, degradados ni imágenes.

Tu respuesta aparecerá aquí.

Ayuda y método

WCAG 2.2 usa luminancia relativa sRGB: (más claro + 0.05) / (más oscuro + 0.05). AA exige 4.5:1 para texto normal y 3:1 para grande; AAA, 7:1 y 4.5:1. Texto grande: desde 18 pt (24 px CSS), o 14 pt en negrita (unos 18.67 px CSS). Se evalúa la razón sin redondear, no el valor mostrado.

WCAG 2.2 · 1.4.3WCAG 2.2 · 1.4.6Métodos y fiabilidad

Ejemplo resuelto

Un ejemplo que puedes probar o adaptar a tus valores.

Color del texto (HEX)
#000000
Color del fondo (HEX)
#ffffff

Resultado

Relación de contraste: 21:1; AA · texto normal: Cumple; AA · texto grande: Cumple; AAA · texto normal: Cumple; AAA · texto grande: Cumple