Analizador de contraste de colores WCAG
Analiza el ratio de contraste entre color de texto y fondo. Verifica el cumplimiento de WCAG 2.1 AA (mínimo) y AAA (mejorado) para garantizar accesibilidad web.
Estándares WCAG de contraste
Las WCAG (Web Content Accessibility Guidelines) definen requisitos mínimos de contraste para garantizar que el contenido sea legible para personas con baja visión o daltonismo.
| Nivel | Texto normal | Texto grande |
|---|---|---|
| AA (mínimo) | 4.5:1 | 3:1 |
| AAA (mejorado) | 7:1 | 4.5:1 |
Texto grande: ≥18pt (24px) normal o ≥14pt (18.67px) en negrita.
¿Por qué importa el contraste?
- Aproximadamente el 8% de los hombres tienen daltonismo.
- Las personas mayores tienen peor agudeza visual y sensibilidad al contraste.
- El contraste bajo afecta a todo el mundo en pantallas brillantes o condiciones de poca luz.
- Es requisito legal en muchos países para sitios web públicos y gubernamentales.
Preguntas frecuentes
¿Cómo se calcula el ratio de contraste?
El ratio es (L1 + 0.05) / (L2 + 0.05), donde L1 es la luminancia relativa del color más claro y L2 del más oscuro. La luminancia se calcula con la fórmula de luminancia WCAG que aplica corrección gamma.
Herramientas relacionadas
Conversor de colores CSS
Convierte colores entre HEX, RGB, RGBA, HSL, HSLA y OKLCH para CSS. Con selector visual, previsualiz…
Usar herramienta →Generador de paleta de colores
Genera paletas de colores armónicas: complementarios, análogos, triádicos y monocromáticos. Con 10 t…
Usar herramienta →Conversor de px a rem
Convierte píxeles a REM y REM a píxeles según el font-size base. Tabla de conversión completa y calc…
Usar herramienta →