Typography Calculator
Create harmonious typographic scales for your designs
Settings
CSS Code
Preview
About Typographic Scales
Typographic scales establish a hierarchy and visual harmony by using mathematical relationships between font sizes.
Common scales include the Minor Second (1.067), Perfect Fourth (1.333), and Golden Ratio (1.618).
Larger ratios create more dramatic contrasts between heading levels.
Additional Information
La tipografía es un componente fundamental del diseño web y gráfico. Una escala tipográfica bien estructurada mejora significativamente la legibilidad, jerarquía visual y experiencia general del usuario en cualquier proyecto.
Las escalas tipográficas se basan en relaciones matemáticas entre tamaños de texto. Históricamente, estas escalas tienen raíces en la música y la arquitectura, donde las proporciones armónicas crean resultados estéticamente agradables. El uso de ratios como la sección áurea (1.618) o el cuarto perfecto (1.333) no es arbitrario; estas proporciones han demostrado ser visualmente satisfactorias a lo largo de siglos de uso.
En el diseño web moderno, una escala tipográfica coherente facilita la lectura y navegación. Los estudios muestran que los usuarios pueden procesar información hasta un 25% más rápido cuando el texto sigue una jerarquía clara y consistente. Esto es especialmente importante en dispositivos móviles, donde el espacio limitado hace que la distinción entre niveles de texto sea crucial.
Al implementar una escala tipográfica, es importante considerar no solo el tamaño de la fuente sino también el interlineado (line-height). Un interlineado adecuado mejora significativamente la legibilidad, especialmente en textos largos. La recomendación general es utilizar un interlineado entre 1.4 y 1.6 veces el tamaño de la fuente para texto normal, aumentando ligeramente para tamaños más pequeños y reduciendo para títulos grandes.