¿Algo va mal con esta herramienta?
Sobre «Contraste WCAG En Línea»
Esta herramienta mide la relación de contraste entre dos colores (normalmente texto en primer plano y fondo) y te dice si el par cumple los estándares WCAG (Web Content Accessibility Guidelines) de legibilidad. Se muestran resultados pass/fail para los niveles AA y AAA en tamaños de texto normal y grande.
El cumplimiento de WCAG es cada vez más un requisito legal: webs gubernamentales, plataformas educativas, herramientas del sector público y muchas webs comerciales en Europa y Norteamérica deben cumplir como mínimo WCAG 2.1 AA. El contraste pobre es el problema de accesibilidad más reportado.
Usa la herramienta al elegir colores de texto durante el diseño, auditar un sitio existente, o encontrar tonos alternativos que alcancen AAA sin cambiar mucho el diseño global.
Cómo usar esta herramienta
Cómo verificar el contraste de color WCAG
Color de primer plano
«Foreground» es el color del texto o icono en hex (#RGB o #RRGGBB). El `#` inicial es opcional y no distingue mayúsculas.
Color de fondo
«Background» es la superficie detrás del primer plano — fondo de página, relleno de botón, etc. Mismos formatos hex. Los dos campos aparecen lado a lado.
Ejecutar
Resultado: contrastRatio (p. ej. 4,56) más wcagNormalText y wcagLargeText con las bandas pass/fail. Texto normal: ≥ 4,5 (AA) / 7 (AAA); texto grande: ≥ 3 (AA) / 4,5 (AAA).
Cómo leer los niveles
AA es el requisito legal/normativo más común; AAA es más estricto y a menudo poco realista para texto corrido. «Large text» significa 18pt+ regular o 14pt+ bold; por debajo, trata el resultado como texto normal.