Comprobador de contraste de color

Utilidades para desarrolladores

Mide los ratios de contraste WCAG y comprueba si el texto cumple AA y AAA para texto normal y grande.

Cómo usar

Check a pair of colors

Pick a foreground and background color. The tool shows the contrast ratio and pass or fail badges for each WCAG level.

Choose the text color.
Choose the background color.
Aim for at least 4.5:1 for normal text.

WCAG thresholds

Normal text needs 4.5:1 for AA and 7:1 for AAA. Large text (18pt or 14pt bold) needs 3:1 for AA and 4.5:1 for AAA.

Preguntas frecuentes

What counts as large text?

WCAG defines large text as at least 18pt (24px) or 14pt (18.66px) when bold.

Is a higher ratio better?

Yes. A ratio of 21:1 is the maximum, achieved by black text on a white background.

Herramientas relacionadas

Generador de paletas de colores Genera paletas de tonos claros, oscuros, análogos, complementarios y tríada desde cualquier color. Conversor de colores Convierte colores entre HEX, RGB y HSL con una muestra de vista previa en vivo. Generador de degradados CSS Diseña degradados CSS lineales o radiales con vista previa en vivo y CSS listo para copiar. Generador de UUID/GUID Genera UUID aleatorios de versión 4 y cópialos uno a uno o en bloque. Generador de hash Calcula resúmenes MD5, SHA-1, SHA-256 y SHA-512 de cualquier texto. Conversor de marca de tiempo Convierte entre marcas de tiempo Unix, ISO 8601 y fechas locales legibles.