Verificador Contraste Color Gratis: WCAG AA AAA Accesibilidad Online
29 usosTexto de muestra
The quick brown fox jumps over the lazy dog. 0123456789
15.39:1
Relación de contraste
Consejos Accesibilidad
Ratio de contraste WCAG
WCAG AA requiere ratio 4.5:1 para texto normal y 3:1 para texto grande. AAA requiere 7:1 y 4.5:1 respectivamente.
Cumplimiento AA y AAA
Se muestra si la combinación cumple WCAG AA y AAA para texto normal y grande. Verde = cumple, rojo = no cumple.
Texto de ejemplo
Previsualiza cómo se ve tu texto con los colores elegidos. Verifica legibilidad antes de implementar.
Preguntas frecuentes
¿Qué ratio de contraste necesito?
WCAG AA: 4.5:1 para texto normal, 3:1 para grande (>18px). AAA: 7:1 y 4.5:1. Cumplir AA es el mínimo recomendado para accesibilidad.
¿Qué es WCAG?
Web Content Accessibility Guidelines — pautas internacionales para hacer contenido web accesible a personas con discapacidades visuales.
¿Cómo mejorar el contraste?
Oscurece el texto o aclara el fondo (o viceversa). Evita combinaciones como gris claro sobre blanco.
¿Puedo probar texto sobre un fondo de imagen?
No, esta herramienta solo funciona con pares de colores sólidos. Para imágenes necesitarás otro programa. Toma una captura de pantalla del área y usa un cuentagotas para muestrear los píxeles más claros y más oscuros donde esté el texto. Prueba ambos contra tu color de texto. Si alguno falla, considera añadir una capa semitransparente detrás del texto — un negro al 40% de opacidad suele funcionar bien.
Cómo Verificar Contraste
- Selecciona color de texto (foreground)
- Selecciona color de fondo (background)
- El ratio de contraste se calcula al instante
- Se muestra cumplimiento WCAG AA y AAA
- Previsualiza con texto de ejemplo