Comprobador de contraste de color
Mide el contraste entre dos colores y comprueba si cumple WCAG AA y AAA para texto normal, texto grande y elementos de interfaz.
- Relación de contraste
- 4.54:1
Vista previa
Texto normal en el tamaño habitual
Texto grande
Relación de contraste
- Texto normalCumple AA
- Texto grande(18pt, o 14pt en negrita)Cumple AAA
- Elementos de interfazCumple AA
Los archivos se procesan en tu navegador y nunca se suben a ningún servidor.
Cómo se usa
De uso gratuito, sin registro, sin instalación y sin límite de uso.
Introduce un color de texto y uno de fondo. La relación y los veredictos se actualizan a la vez, y la vista previa muestra la pareja en los dos tamaños de texto.
WCAG fija listones distintos según el caso. El texto normal necesita 4,5:1 para AA y 7:1 para AAA. El texto grande —18pt, o 14pt en negrita— necesita 3:1 y 4,5:1. Los bordes, iconos y demás elementos de interfaz necesitan 3:1.
La relación se redondea hacia abajo, no al valor más cercano. Una pareja de 4,499 mostrada como 4,50 parecería aprobar sin hacerlo, y ese es el único caso en que la dirección del redondeo cambia la respuesta.
Cuando una pareja se queda corta se ofrece una sugerencia. Desplaza el color del texto por su propia luminosidad hasta alcanzar el objetivo en vez de saltar al negro o al blanco, de modo que el diseño conserva su tono.
Los colores se pueden escribir en hexadecimal, incluida la forma corta de tres dígitos, o como rgb().
Nada de lo que escribes se envía a un servidor. Todo se calcula dentro de tu navegador.