Comprobá el contraste entre texto y fondo, verificá WCAG AA y AAA y encontrá alternativas accesibles sin perder la identidad visual.
Configurá los colores
Probá texto y fondo. El cálculo se hace localmente en tu navegador.
Vista previa
Así se ve la combinación en una interfaz real.
Diseño claro, decisiones mejores.
El contraste correcto mejora la legibilidad sin obligarte a resignar la identidad visual.
WCAG
Resultados según los umbrales de contraste para texto.
“Texto grande” equivale aproximadamente a 24 px regular o 18.66 px en negrita.
Sugerencias accesibles
Mantenemos hue y saturación, y movemos lo mínimo posible la luminosidad del texto.
Valores técnicos
Una lectura rápida para diseño y desarrollo.
- Texto RGB
- —
- Texto HSL
- —
- Fondo RGB
- —
- Fondo HSL
- —
—
Guardar o compartir
El enlace guarda solamente los dos colores, sin almacenar datos personales.
El ratio matemático no reemplaza una revisión completa de accesibilidad: tamaño, peso, opacidad, estados y contexto también importan.
Cómo interpretar el resultado
Probá la combinación de colores y revisá los umbrales para texto normal y grande. El resultado orienta una decisión puntual: la accesibilidad de una interfaz también depende de tipografía, tamaño, estados y contexto.
Si todavía estás definiendo una combinación, podés generar una paleta de colores y volver para comprobar sus contrastes.
Para qué sirve
Sirve para revisar una combinación puntual de texto y fondo antes de llevarla a una interfaz. El ratio es una referencia matemática: tamaño, peso tipográfico, opacidad, estados y contexto también requieren revisión.