Comprobador de contraste

Procesado en este navegador

Límite de texto: 2000000 caracteres

Esta herramienta no sube tu entrada.

Pegas el color del texto y el del fondo y ves si llegan a 4,5:1 (AA) o 7:1 (AAA). Sirve para un botón o un aviso legal. No recorre tu WordPress.

El aviso de cookies quedó gris sobre gris y en el móvil no se lee. En el SERP en español la auditoría WCAG aparece colgada de paletas y degradados; esta URL es solo el par de colores.

La fórmula es (L1 + 0,05) / (L2 + 0,05) con luminancia relativa. 21:1 es negro sobre blanco. Un cian de marca sobre blanco a menudo no llega a 4,5:1 aunque «se vea bien» en el monitor del diseñador.

Cómo comprobar un botón

  1. Saca los hex (el cuentagotas si solo tienes captura).
  2. Pega texto y fondo. Mira AA / AAA.
  3. Si falla, oscurece el texto o el fondo; no bajes el cuerpo a 11 px para «colar» AA grande.

La paleta de marca se arma en el generador de paletas. La sombra de la card no arregla el texto: box-shadow.

Límites

  • Un par no es una auditoría UNE-EN 301 549 ni un informe para licitación.
  • Texto sobre foto: mide el recorte opaco, no el promedio de la imagen.
  • WCAG 2.2 tiene más criterios (objetivo de clic, etc.) que no caben aquí.

Cuenta local. El criterio legal de tu país no lo firmamos nosotros.

Preguntas frecuentes

¿Qué número necesito?

WCAG 2 AA: 4,5:1 para texto normal, 3:1 para texto grande (aprox. 18 pt o 14 pt en negrita). AAA: 7:1 en cuerpo. Esta página calcula la fórmula; no certifica tu sitio.

El fondo es un degradado.

El ratio es entre dos colores planos. Un hero degradado cambia a lo largo: comprueba el peor tramo o pon el texto sobre una tarjeta opaca. El degradado CSS no sustituye esta cuenta.

¿Incluye daltonismo o WCAG 3?

No. Es luminancia relativa de WCAG 2. No es un simulador de protanopia.

El botón tiene borde y sombra.

El cálculo ignora bordes, sombras e imágenes. Mide el relleno real detrás de las letras.

¿Se envían los hex?

No. Es aritmética en la pestaña.

Herramientas relacionadas