Accesibilidad
Verificador de contraste de color - WCAG AA y AAA
Comprueba el contraste entre el color del texto y el del fondo según WCAG AA y AAA. Previsualiza texto normal, texto grande, botones, enlaces y combinaciones en modo oscuro.
Vista previa de legibilidad
Usa esta vista previa para valorar texto, controles y superficies antes de publicar tu diseño.
Texto grande · Texto normal
- AA Texto normal ≥ 4.5Cumple
- AA Texto grande ≥ 3Cumple
- AAA Texto normal ≥ 7Cumple
- AAA Texto grande ≥ 4.5Cumple
Cómo usar esta herramienta
Prueba una combinación de primer plano y fondo, previsualiza texto normal y grande y genera el color de texto más cercano que cumple WCAG AA. Úsalo para texto de párrafo, botones, enlaces, insignias y superficies en modo oscuro.
- 1 Elige el color del texto y el del fondo.
- 2 Revisa los resultados AA y AAA para texto normal y grande.
- 3 Usa el color accesible sugerido cuando una combinación no cumpla.
Preguntas frecuentes
¿Qué relación de contraste exige WCAG AA?
El texto normal necesita 4.5:1 y el texto grande 3:1.
¿Qué relación de contraste exige WCAG AAA?
El texto normal necesita 7:1 y el texto grande 4.5:1.
¿Debo comprobar los colores de botones y enlaces?
Sí. Prueba los estados normal, hover, foco, deshabilitado y visitado, porque cada combinación puede dar una relación de contraste distinta.
¿Se pueden comprobar colores transparentes?
Los primeros planos o fondos transparentes deben componerse sobre el fondo visible final antes de evaluar el contraste.