Verificador de contraste
Comprueba si la combinación de color de texto y fondo cumple los criterios de contraste WCAG 2.1 (AA y AAA) para texto normal y grande. Muestra el ratio exacto y una vista previa. Esencial para accesibilidad web.
Texto de ejemplo grande
Este es un texto normal de muestra para evaluar la legibilidad.
17.05:1
Ratio de contraste
Texto normal
AA (4.5:1)Pasa
AAA (7:1)Pasa
Texto grande
AA (3:1)Pasa
AAA (4.5:1)Pasa
Otras herramientas
Preguntas frecuentes
- ¿Qué es el ratio de contraste WCAG?
- Es una medida de la diferencia de luminancia entre el texto y su fondo, que va de 1:1 (sin contraste) a 21:1 (negro sobre blanco). Las pautas WCAG 2.1 definen mínimos para garantizar que el texto sea legible por personas con baja visión.
- ¿Qué diferencia hay entre nivel AA y AAA?
- AA es el nivel recomendado para la mayoría de webs: exige 4.5:1 en texto normal y 3:1 en texto grande. AAA es el nivel reforzado: exige 7:1 en texto normal y 4.5:1 en grande, ideal para máxima accesibilidad.
- ¿Qué se considera "texto grande"?
- Según WCAG, texto grande es a partir de 18pt (24px) en peso normal, o 14pt (18.66px) en negrita. Al ser más fácil de leer, se le permite un contraste algo menor.
- ¿Por qué es importante el contraste de color?
- Un buen contraste hace tu web legible para personas con baja visión, daltonismo o en condiciones de mucha luz. Además, es un requisito legal de accesibilidad en muchos países y mejora la experiencia de todos los usuarios.
- ¿Cómo introduzco los colores?
- Puedes usar el selector de color o escribir el código HEX directamente (por ejemplo #1a1a1a o #abc). El ratio y los resultados AA/AAA se actualizan en tiempo real.