Machinetix

Calculadora de Tipografía

Genera escalas tipográficas armónicas usando ratios matemáticos perfectos como el Golden Ratio.

Escala Tipográfica

xsThe quick brown fox
10.24px
smThe quick brown fox
12.80px
baseThe quick brown fox
16.00px
lgThe quick brown fox
20.00px
xlThe quick brown fox
25.00px
2xlThe quick brown fox
31.25px
3xlThe quick brown fox
39.06px
4xlThe quick brown fox
48.83px

Variables CSS

:root {
  --font-size-xs: 10.24px;
  --font-size-sm: 12.80px;
  --font-size-base: 16.00px;
  --font-size-lg: 20.00px;
  --font-size-xl: 25.00px;
  --font-size-2xl: 31.25px;
  --font-size-3xl: 39.06px;
  --font-size-4xl: 48.83px;
}

¿Cómo usar la calculadora?

  1. Selecciona un tamaño base para tu tipografía (generalmente 16px)
  2. Elige un ratio de escala (Golden Ratio, Major Third, etc.)
  3. Revisa la escala generada con todos los tamaños calculados
  4. Copia los valores CSS generados para usar en tu proyecto
  5. Ajusta el ratio o tamaño base hasta encontrar la escala perfecta

Características

  • Múltiples ratios de escala predefinidos (Golden Ratio, Perfect Fourth, etc.)
  • Generación automática de escalas tipográficas armónicas
  • Vista previa visual de cada tamaño de fuente
  • Exportación de código CSS listo para usar
  • Cálculo en px, rem y em
  • Escalas matemáticamente perfectas y visualmente equilibradas
  • Actualización en tiempo real al cambiar parámetros

Casos de uso

  • Crear sistemas de diseño consistentes para proyectos web
  • Establecer jerarquías tipográficas claras y armónicas
  • Generar variables CSS para frameworks como Tailwind
  • Diseñar interfaces con proporciones matemáticamente perfectas
  • Mantener consistencia tipográfica en equipos de diseño
  • Optimizar la legibilidad con escalas bien proporcionadas

Consejos

  • El Golden Ratio (1.618) es ideal para diseños elegantes y clásicos
  • Major Third (1.25) funciona bien para interfaces modernas y limpias
  • Usa rem en lugar de px para mejor accesibilidad
  • Mantén al menos 3-4 niveles de jerarquía para flexibilidad