Comprobar el contraste de color

Elige dos colores y verás la relación de contraste, si cumple AA y AAA, y qué aspecto tiene de verdad la combinación, también con texto japonés, que es más denso y cuesta más leer con poco contraste.

Cargando la herramienta…

Cómo funciona

  1. Elige un color de texto y otro de fondo, o pega valores hexadecimales.
  2. Lee la relación de contraste y los cuatro resultados de apto o no apto.
  3. Ajusta hasta que el texto normal supere 4,5:1.

Por qué no se sube nada

Todo lo que hace esta página lo ejecuta código que corre dentro de la pestaña de tu navegador, con el mismo motor que dibuja las páginas web. El archivo se lee del disco a la memoria de la pestaña, se transforma ahí y se vuelve a escribir como descarga. No se envía a ninguna parte: ni a nosotros, ni a terceros.

Compruébalo tú mismo

  1. Abre las herramientas de desarrollo del navegador (F12) y elige la pestaña «Red».
  2. Carga tu archivo y ejecuta la herramienta.
  3. Las únicas peticiones que verás descargan el código de la propia herramienta —y, en unas pocas herramientas pesadas, su motor de código abierto desde un CDN público—, más un pequeño aviso de visita a loreatec.jp (dirección y título de la página, nada más). Ninguna lleva tu archivo.

Compruébalo tú mismo →

Preguntas frecuentes

¿Qué umbral me aplica?

4,5:1 para el texto normal; 3:1 para texto de 24 px o más (19 px si es negrita) y para elementos de interfaz como bordes de campos e iconos; 7:1 para AAA. Si solo vas a recordar un número, que sea 4,5.

Mi diseño cumple, pero sigue costando leerlo.

La relación de contraste no mide el grosor de la letra, ni el tamaño, ni el espaciado, y una tipografía fina y clara a 4,5:1 resulta realmente incómoda. El panel de vista previa está ahí para que juzgues también con los ojos, no solo con el número; sobre todo en japonés, donde los kanji densos a tamaño pequeño necesitan más contraste del que exige la fórmula.