Verificador de Contraste de Colores

Comprueba si tus combinaciones de colores cumplen con las pautas de accesibilidad WCAG

Colores

Colores comunes

Clic izquierdo para seleccionar color de fondo, clic derecho para color de texto

Vista previa

Texto pequeño (12px)
colorContrast.normalText (14px)
Texto grande (18px)
colorContrast.headingText (24px)

Resultados

Relación de contraste21.00:1

Sobre WCAG

Las Pautas de Accesibilidad de Contenido Web (WCAG) establecen estándares para hacer el contenido web más accesible.

Para el contraste de color, WCAG define estas relaciones mínimas:

  • AA (estándar): 4.5:1 para texto normal, 3:1 para texto grande
  • AAA (mejorado): 7:1 para texto normal, 4.5:1 para texto grande
  • El texto grande se define como 18pt (24px) o 14pt (18.5px) en negrita

Verificador de Contraste de Color - Herramienta de Cumplimiento WCAG

Asegúrese de que su sitio web cumpla con los estándares de accesibilidad con nuestra herramienta gratuita de verificación de contraste de color.

Compruebe si sus combinaciones de color de texto y fondo proporcionan suficiente contraste para la legibilidad de acuerdo con las directrices WCAG.

Obtenga retroalimentación instantánea sobre las relaciones de contraste y el cumplimiento con los diferentes niveles WCAG (AA, AAA).

Perfecto para diseñadores, desarrolladores y creadores de contenido que desean crear contenido digital accesible.

Mejore la usabilidad de su sitio web para todos los usuarios, incluidos aquellos con discapacidades visuales.

Estándares de Contraste WCAG 2.1:

  • Nivel AA (mínimo): 4.5:1 para texto normal, 3:1 para texto grande
  • Nivel AAA (mejorado): 7:1 para texto normal, 4.5:1 para texto grande
  • El texto grande se define como 14pt (18.66px) y negrita o más grande, o 18pt (24px) y más grande
  • Los elementos no textuales (como los iconos) deben tener una relación de contraste de al menos 3:1

Beneficios de un Buen Contraste de Color:

Legibilidad mejorada para todos los usuarios, mejor experiencia de usuario en diversas condiciones de iluminación, cumplimiento de las leyes y estándares de accesibilidad, y alcance a una audiencia más amplia, incluidos los usuarios con discapacidades visuales.