Verificador de accesibilidad de color — contraste WCAG y simulación de daltonismo
Verificador gratis de contraste WCAG 2.1 para probar cualquier combinación de colores frente a estándares de accesibilidad. Verifica la legibilidad del texto para los niveles AA y AAA — esencial para un diseño web inclusivo.
Cómo usarlo
1
Elige o introduce los colores de primer plano y fondo con los selectores o los campos hex/RGB.
2
Mira la vista previa de texto y comprueba los resultados de cumplimiento WCAG AA/AAA.
3
Revisa la tira de simulación de daltonismo para ver cómo percibe cada tipo de CVD tus colores.
4
Si alguna comprobación falla, haz clic en una alternativa sugerida para arreglar el par al instante.
5
Usa el modo Paleta para comprobar todas las combinaciones de tu sistema de diseño.
Verifica pares de color para cumplir el contraste WCAG y la distinguibilidad para daltónicos
Elige dos colores para comprobar la ratio de contraste y la visibilidad para daltónicos.
Primer plano
Fondo
Texto grande (18 pt+)
Vista previa de encabezado
Texto normal (16 px)
El veloz murciélago hindú comía feliz cardillo y kiwi.
Vista previa de texto — así verán tus usuarios esta combinación de color en contenido real.
Contraste WCAG 2.1
AA exige 4,5:1 para texto normal y 3:1 para texto grande. AAA exige 7:1 / 4,5:1.
12.63:1
AA Normal
Pasa
AA Grande
Pasa
AAA Normal
Pasa
AAA Grande
Pasa
Simulación de daltonismo
Cómo se ve tu par de colores para personas con distintos tipos de deficiencia de visión cromática.
Alternativas sugeridas
Alternativas de color accesibles que pasan WCAG AA y son distinguibles bajo todos los tipos de CVD.
Comprobación de paleta
Pega de 3 a 10 colores hex (uno por línea o separados por coma) para comprobar todas las combinaciones de pares.
Publicada
Actualizada
