Comprobador de contraste y legibilidad
Asegúrate de que los textos de tu web o app se lean con facilidad sobre el fondo, cumpliendo las pautas de lectura accesible.
Título Principal de Ejemplo
Este párrafo demuestra cómo se percibe el texto corriente bajo la combinación de color seleccionada. Una buena relación de contraste evita la fatiga visual y permite que los usuarios lean con claridad en cualquier dispositivo.
Comprobador de contraste de color WCAG 2.1 (Niveles AA y AAA)
Un texto gris claro sobre fondo blanco o un botón con poco contraste no solo perjudica a personas con problemas de visión o daltonismo, sino que también resulta ilegible para cualquier usuario bajo la luz directa del sol. Las directrices internacionales de accesibilidad web (WCAG) exigen unos ratios de contraste mínimos para cumplir con la ley y garantizar una buena experiencia de usuario.
Con este verificador puedes calcular la relación de contraste exacta entre el color de fondo y el color de texto. Comprueba al instante si tu diseño supera los niveles AA y AAA para texto normal y grande, e interactúa con el botón de sugerencia inteligente para ajustar el tono automáticamente si no cumple.
Comparativa antes y después
Comprueba la diferencia de tamaño, nitidez y velocidad.
2.1:1 Ratio
Ilegible bajo el sol y no accesible (Falla WCAG)
- •Rechazado por auditorías de accesibilidad europeas y americanas.
- •Dificultad extrema de lectura en pantallas móviles y exteriores.
- •Aumenta la tasa de rebote y abandono en formularios web.
7.8:1 Ratio
Lectura cristalina en cualquier condición de luz
- ✓Supera con creces los niveles AA (4.5:1) y AAA (7:1).
- ✓Accesibilidad universal para personas con baja agudeza visual.
- ✓Ajuste inteligente de color con un solo clic.
Cuándo vas a necesitar comprobar el contraste
Auditorías de accesibilidad web y apps
Verifica que los botones, títulos y textos de tu web cumplan con las normativas europeas y estándares WCAG 2.1.
Formularios y mensajes de error
Comprueba que los avisos en rojo, botones deshabilitados y campos de texto se distingan con total claridad.
Diseño de sistemas y guías de estilo
Define los pares cromáticos oficiales de tu marca asegurando que todas las aplicaciones futuras sean legibles.
Preguntas frecuentes sobre contraste WCAG
Para texto estándar (menos de 18 pt o 14 pt en negrita), el ratio mínimo exigido es de 4.5:1. Para texto grande o titulares destacados, el mínimo es de 3:1.
El nivel AA es el estándar legal obligatorio en la mayoría de administraciones públicas y empresas. El nivel AAA es el estándar más estricto (mínimo 7:1) recomendado para garantizar máxima accesibilidad.
Si un color no alcanza el ratio requerido, el algoritmo calcula el ajuste mínimo de luminosidad necesario para que cumpla el estándar sin cambiar el tono de color original.