Verifica el contraste de color contra WCAG AA y AAA. Soluciones de un clic que cumplen — cubre texto normal, texto grande y componentes UI.
Color del texto (primer plano)
Color del fondo
—:1
Ratio de contraste
Vista previa — texto sobre fondo
El rápido zorro
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Este es texto de cuerpo a 14px para verificar el contraste de texto pequeño.
Botón
Vista previa — intercambiados
El rápido zorro
Mismo texto y fondo, intercambiados. Algunos pares de colores solo funcionan en una dirección.
Botón
Soluciones rápidas — colores que pasan más cercanos
Sobre el contraste WCAG
AA es el estándar legal en la mayoría de jurisdicciones: 4.5:1 para texto normal, 3:1 para texto grande (18pt+ o 14pt negrita).
AAA es "mejorado": 7:1 normal, 4.5:1 grande. Apunta a esto en el texto del cuerpo si puedes.
Los componentes UI (botones, bordes de formularios, íconos) necesitan 3:1 contra su color adyacente — igual que el texto grande.
Cuidado con que el significado dependa solo del color. Empareja el color con un ícono, un subrayado o una etiqueta para que los usuarios con daltonismo también reciban la señal.
Tanto Apple HIG como Material exigen un mínimo de 4.5:1 para texto en tu app — no cumplir esto es una señal conocida en la revisión de accesibilidad del App Store.
¿Necesitas también capturas accesibles?
LaunchShots viene con hints de contraste integrados en el editor — pruébalo.