Legibilidad del texto
Prueba la legibilidad del texto sobre pares de color de texto y fondo con vista previa. Verifica el contraste, detecta combinaciones difíciles y elige mejor.
Vista previa en tiempo real
Título de ejemplo
Aquí tienes un texto de ejemplo para probar la legibilidad. The quick brown fox jumps over the lazy dog. 0123456789
Texto más pequeño para comparar
Puntuación de legibilidad
Conformidad con WCAG 2.1
Texto normal (≥4,5:1)
Texto grande (≥3:1)
Texto normal (≥7:1)
Texto grande (≥4,5:1)
Ajustes
Prueba la legibilidad del texto sobre pares de color de texto y fondo con vista previa. Verifica el contraste, detecta combinaciones difíciles y elige mejor.
Legibilidad del texto muestra únicamente los controles y resultados que corresponden a su función. Las opciones disponibles dependen de la herramienta y de la entrada.
Formatos compatibles
Cómo funciona
Paso 1
Abre Legibilidad del texto y prepara la entrada solicitada por la interfaz
Paso 2
Ajusta los controles visibles según el resultado que buscas
Paso 3
Revisa el resultado antes de copiarlo, exportarlo o reutilizarlo
Errores comunes a evitar
- No des por compatible un formato u opción que no aparezca en la interfaz.
- Comprueba los valores antes de reutilizarlos en una identidad visual, interfaz o archivo final.
- Si el resultado se usa en texto o componentes de interfaz, revisa también el contraste.
Consejos de profesionales
- Conserva el valor de origen junto al resultado para poder comparar variantes.
- Usa los formatos que muestra realmente la herramienta en lugar de estimar conversiones.
- En móvil y tableta, permite que textos y controles ocupen varias líneas.
Tratamiento de datos
El tratamiento depende de la función utilizada. El consentimiento, la analítica y las funciones de cuenta del sitio son servicios separados de la operación de color.
Qué hace esta herramienta
Prueba la legibilidad del texto sobre pares de color de texto y fondo con vista previa. Verifica el contraste, detecta combinaciones difíciles y elige mejor. Legibilidad del texto se centra en esa tarea y no presupone funciones que no aparecen en su interfaz. Utiliza los controles disponibles para obtener el resultado necesario y comprueba los valores mostrados antes de trasladarlos a otra herramienta, hoja de estilos, archivo de diseño o documento.
Preparar una entrada adecuada
Empieza con la entrada que solicita Legibilidad del texto: color, valor, imagen o ajuste según la pantalla. Los formatos indicados para esta página son HEX, RGB, HSL, Texte. Si un formato u opción no aparece en la interfaz, no lo consideres compatible con esta función concreta.
Leer y comprobar el resultado
Interpreta el resultado según la operación realizada. Compáralo con el valor de origen y revisa los controles que han influido en el cálculo. Para trabajos visuales importantes, comprueba también el resultado en la interfaz real en la que se utilizará y no solo a partir del código.
Uso en móvil y tableta
Legibilidad del texto usa el diseño responsive del sitio. Los títulos, subtítulos, breadcrumbs y controles pueden pasar a varias líneas en pantallas estrechas para que las traducciones largas no se corten. Aun así, revisa el resultado final en el dispositivo y el contexto en los que lo utilizarás.
Reutilizar el resultado en tu proyecto
Después de comprobar el resultado, usa únicamente las acciones que ofrece Legibilidad del texto, como copiar o exportar cuando estén disponibles. Conserva el valor de origen si necesitas reproducir el ajuste y, en trabajos de interfaz, documenta también la función del color y el contraste necesario.
Herramientas relacionadas
Guías y tutoriales
Aprende a usar nuestras herramientas con nuestras guías detalladas.
text-readability: guía práctica de accessibility
Guía localizada para usar text-readability, entender buenas prácticas de accessibility y evitar errores comunes.
text-readability: guía práctica de accessibility
Guía localizada para usar text-readability, entender buenas prácticas de accessibility y evitar errores comunes.
text-readability: guía práctica de accessibility
Guía localizada para usar text-readability, entender buenas prácticas de accessibility y evitar errores comunes.
Preguntas frecuentes
Aprende a usar nuestras herramientas con nuestras guías detalladas.