Comprobador de contraste WCAG
Comprueba si la combinación de color de texto y fondo cumple los niveles de accesibilidad AA y AAA.
Cómo comprobar el contraste de dos colores
Elige el color de texto y de fondo
Escribe los códigos HEX o usa los selectores visuales para ambos colores.
Consulta el ratio de contraste
Verás el ratio calculado al instante junto con la vista previa del texto sobre el fondo elegido.
Comprueba si cumple WCAG AA o AAA
La herramienta indica si la combinación es apta para texto normal y para texto grande, en cada nivel.
Preguntas frecuentes sobre el contraste de color
Un buen contraste entre texto y fondo es imprescindible para que cualquier persona pueda leer tu contenido, incluidas las personas con baja visión. PDFDocks calcula el ratio exacto según el estándar WCAG.
¿Qué significa AA y AAA?
+
Son los dos niveles de conformidad de las pautas de accesibilidad WCAG: AA es el mínimo recomendado y AAA es el nivel más exigente.
¿Qué ratio de contraste necesito?
+
Para texto normal se recomienda un mínimo de 4.5:1 (AA) o 7:1 (AAA); para texto grande, 3:1 (AA) o 4.5:1 (AAA).
¿Por qué es importante el contraste?
+
Un contraste insuficiente dificulta la lectura, especialmente para personas con baja visión o en pantallas con mucha luz ambiental.
¿Necesito instalar algún programa?
+
No, no hace falta instalar nada. Funciona directamente desde el navegador.
¿Es gratis?
+
Sí, esta herramienta es completamente gratuita.
¿Sirve para revisar el diseño de una web entera?
+
Sirve para comprobar combinaciones concretas; para auditar una web completa necesitarás revisar cada combinación de texto y fondo que uses.
Colores
Conversor de colores (HEX, RGB, HSL, CMYK)
Convierte cualquier color entre HEX, RGB, HSL y CMYK al instante, con vista previa en vivo y el nombre de color más cercano.
Generador de paletas de colores
Crea paletas de 5 colores armoniosas (complementarias, análogas, triádicas o monocromáticas) a partir de un color base.
Generador de gradientes CSS
Crea degradados lineales o radiales con hasta 4 colores y copia el código CSS listo para usar.
Color aleatorio
Genera un color aleatorio con un clic y descubre su nombre, su código HEX/RGB/HSL y colores similares.
Selector de color (cuentagotas)
Elige cualquier color de tu pantalla con la herramienta cuentagotas del navegador, o usa el selector clásico.
Simulador de daltonismo
Sube una imagen y comprueba cómo la verían personas con protanopia, deuteranopia o tritanopia.
