Comprobador de contraste
Introduce un color de texto y uno de fondo para ver la relación de contraste WCAG y qué niveles AA y AAA se cumplen.
Cada comprobación se hace en tu navegador. Nada de lo que introduces se sube a BroBroGo.
Preguntas frecuentes
¿Qué significan los resultados AA y AAA?
AA es el nivel al que apunta la mayoría de los sitios: exige una relación de al menos 4.5:1 para texto normal y 3:1 para texto grande. AAA es más exigente: 7:1 para texto normal y 4.5:1 para texto grande. La relación va de 1:1 (sin contraste) a 21:1 (negro sobre blanco).
¿Qué se considera texto grande?
El texto a partir de 18pt (unos 24px), o de 14pt (unos 18.5px) si está en negrita. El texto grande sigue siendo legible con menos contraste, así que cumple AA a 3:1 y AAA a 4.5:1, en lugar de los umbrales más estrictos del texto normal.
¿Qué formatos de color puedo introducir?
Escribe un valor hex como #1a1a1a, un valor rgb() como rgb(26, 26, 26) o un valor hsl(); también puedes hacer clic en cualquiera de las muestras para elegir un color. Usa el botón de intercambio para invertir los colores de texto y fondo.
¿Es WCAG 2 o el método APCA más reciente?
Usa la fórmula de WCAG 2.1 / 2.2, la que hoy toman como referencia las normas de accesibilidad y las auditorías. APCA es un método más nuevo y perceptual, todavía en borrador para WCAG 3: prometedor, pero aún no es un estándar de conformidad, así que los resultados de aquí no se basan en él.