Umbrales de contraste WCAG AA
Formula
Texto normal: 4,5:1; texto grande (≥18 puntos o 14 puntos en negrita): 3:1; Componentes de la interfaz de usuario: 3:1.
Variables
- R, G, B
- Canales sRGB (0–255 o 0–1 normalizados)
- H, S, L
- Tono (grados), saturación y luminosidad (0–1) en HSL
- l
- Luminancia relativa (WCAG) o luminosidad en HSL/OKLCH
FAQ
- ¿Los umbrales de contraste WCAG AA son precisos para los flujos de trabajo de impresión?
- La pantalla RGB y la impresión CMYK utilizan diferentes gamas. Trate las conversiones como pruebas aproximadas; calibre con perfiles ICC para impresión comercial.
- ¿Puedo usar esta fórmula en CSS?
- El CSS moderno admite color-mix(), oklch() y lab() para muchas operaciones. Para canalizaciones complejas, calcule en JavaScript y exporte variables CSS.
- ¿Color DevByte carga mis colores?
- No. Las páginas de referencia de fórmulas son documentación estática; Las herramientas interactivas se ejecutan 100% del lado del cliente en su navegador.
Descripción general
Relaciones de contraste mínimas para el cumplimiento del nivel AA.
Color DevByte documenta esta fórmula para desarrolladores, diseñadores y revisores de accesibilidad que necesitan matemáticas de color reproducibles sin enviar datos a un servidor.
Utilice las herramientas de color vinculadas para aplicar esta fórmula de forma interactiva con vista previa en vivo y exportación multiformato.
Cuándo utilizar esta fórmula
Aplique los umbrales de contraste de wcag aa al crear tokens de diseño, validar el contraste de WCAG o automatizar canalizaciones de color en CSS, Tailwind o JSON del sistema de diseño.
Para la interfaz de usuario de producción, verifique siempre los resultados con un verificador de contraste o una vista previa visual: los casos extremos en la corrección gamma y el mapeo de gama pueden cambiar los resultados.
Notas de implementación
Las herramientas basadas en navegador deben linealizar sRGB antes de los cálculos de luminancia o ΔE.
Prefiera la interpolación OKLCH o LAB para degradados y temas para evitar puntos medios grisáceos comunes en las mezclas RGB.