Generador de Escala Modular Tipográfica
Genera una escala de tamaños de fuente coherente a partir de un tamaño base y una proporción
도구를 불러오는 중…
🔒 Todo se procesa 100 % en tu navegador. Tus archivos y datos nunca se suben a ningún servidor.
Esta herramienta calcula nueve tamaños de fuente armónicos, de XS a 5XL, a partir de un tamaño base y una proporción como la Razón Áurea o la Quinta Justa, con una vista previa en tiempo real. Está pensada para diseñadores y desarrolladores front-end que quieren definir una escala tipográfica sistemática para un sitio web, y el resultado se puede copiar directamente como variables CSS o configuración de Tailwind CSS. Todo el cálculo se realiza en el navegador, sin enviar datos a ningún servidor.
Cómo usar
- Introduce el tamaño de fuente base en píxeles.
- Elige una proporción de la lista, desde 1.067 (segunda menor) hasta 2.000 (octava/doble).
- Escribe tu propio texto de muestra para ver cómo se ve realmente cada nivel.
- Copia las variables CSS o la configuración de Tailwind generadas y pégalas en tu proyecto.
Preguntas frecuentes
- ¿Qué proporción debería elegir?
- Las proporciones pequeñas, como 1.125–1.25, funcionan bien en interfaces con mucho texto, mientras que las más grandes, como 1.5 o la Razón Áurea (1.618), son ideales para landing pages con titulares muy contrastados. Lo mejor es comparar directamente en la vista previa.
- ¿Por qué los valores aparecen en rem y no en px?
- rem respeta la configuración de tamaño de fuente del navegador del usuario, lo que mejora la accesibilidad, y es la unidad estándar para tipografía responsiva. Junto a cada valor rem también se muestra su equivalente en px.
- ¿Cómo uso el resultado en mi proyecto?
- Pega las variables CSS dentro de tu bloque :root, o incorpora la configuración de Tailwind en la sección fontSize de tu archivo tailwind.config.