Comprobador de contraste de color

Comprueba relaciones de contraste WCAG para colores de primer plano y fondo, previsualiza texto real, ve resultados AA y AAA y copia un informe de accesibilidad.

Comprueba el contraste WCAG antes de publicar un par de colores

Usa el Comprobador de contraste de color para probar colores de primer plano y fondo frente a umbrales de contraste WCAG comunes. Escribe o elige colores, previsualiza tu propio texto, ajusta tamaño y peso de fuente y copia un informe claro para revisión de diseño o seguimiento de incidencias.

El resultado incluye la relación de contraste exacta, estados de aprobado o no aprobado AA y AAA para texto normal, texto grande y componentes de interfaz, además de sugerencias prácticas de primer plano.

Úsalo cuando

  • Elijas colores de texto y fondo para botones, tarjetas, dashboards, formularios o documentación.
  • Audites colores de marca antes de usarlos en texto de interfaz legible.
  • Compruebes si un tamaño de fuente cuenta como texto grande según los umbrales WCAG.
  • Copies una nota de accesibilidad en un ticket, pull request o entrega de diseño.

Cargando herramienta...

FAQ del comprobador de contraste de color

¿Qué umbrales se comprueban?

La herramienta comprueba 4.5:1 y 7:1 para texto normal, 3:1 y 4.5:1 para texto grande y 3:1 para componentes de interfaz.

¿El texto en negrita cambia el resultado de texto grande?

Sí. El texto en negrita se considera grande con un tamaño de píxel menor que el texto normal.

¿Puedo encontrar un color accesible cercano?

Sí. El comprobador sugiere una dirección de primer plano AA cercana conservando el tono original tanto como sea práctico.

Herramientas relacionadas