Comprobador de accesibilidad del color

Introduce cualquier color HEX para comprobar su contraste en fondos claros y oscuros. Obtén la relación, el resultado WCAG y la mejor opción de color de texto.

Color de texto recomendado
#000000

Sobre blanco

3.68:1

Aa

Accessible sample text

Texto normal: No cumple
Texto grande: Cumple

Sobre negro

5.71:1

Aa

Accessible sample text

Texto normal: Cumple
Texto grande: Cumple

Cómo usar el comprobador

  1. Introduce un color HEX o selecciónalo con el picker.
  2. Revisa la relación de contraste sobre blanco y negro.
  3. Usa el resultado WCAG para elegir colores de texto y UI más legibles.

Por qué importa el contraste

Un buen contraste ayuda a que más personas lean el contenido con claridad, especialmente quienes tienen baja visión o condiciones de iluminación difíciles.

WCAG recomienda al menos 4,5:1 para texto normal y 3:1 para texto grande. Un mayor contraste suele mejorar la legibilidad general.

La herramienta calcula todo localmente en tu navegador, sin subir datos.

Preguntas frecuentes

¿Qué es una relación de contraste?

Mide la diferencia de luminancia entre el color del texto y el fondo. Cuanto mayor sea, más fácil será leer.

¿Qué valor cumple WCAG para texto normal?

WCAG AA recomienda al menos 4,5:1 para texto normal.

¿Qué se considera texto grande?

Generalmente 18pt normal o 14pt en negrita. En ese caso, 3:1 es suficiente para AA.

¿Por qué comprobar blanco y negro?

Porque así ves rápidamente si el color funciona mejor como texto oscuro o claro.

¿Es privado?

Sí. El cálculo se realiza por completo en tu navegador.

¿Te gustan estas herramientas? Si estas herramientas gratuitas te ahorraron tiempo, ¡considera invitarnos un café! Apoyar en Ko-fi