Escala tipográfica y fuente fluida (clamp)
Elige el tamaño base y la proporción para el celular y para la computadora. La herramienta genera los tamaños de h1 a texto pequeño, con clamp() para que la fuente crezca suavemente entre las dos pantallas.
Cómo usarTamaños de fuente en armonía
Disponible en: 
Escala tipográfica y fuente fluida (clamp): para qué sirve
Elige el tamaño base y la proporción (de segunda menor a proporción áurea) para el celular y para la computadora, y los anchos de pantalla de cada uno. La herramienta calcula los tamaños de h1, h2, h3, h4, h5, texto y pequeño en las dos pantallas y arma el clamp() de cada uno, en rem.
La vista previa muestra tu texto en cada tamaño, en el celular o en la computadora, y el CSS sale con variables listas.
Cómo usar
- Elige base y proporción para celular y computadora.
- Revisa la vista previa de cada nivel.
- Copia las variables CSS.
Cuándo usar
- Definir los tamaños de fuente de un sitio nuevo.
- Títulos que se ajustan al celular sin media queries.
- Crear la tipografía de un sistema de diseño.
Preguntas frecuentes
¿Qué es una escala tipográfica?
Es una secuencia de tamaños en la que cada uno es el anterior multiplicado por la misma proporción, como 1,25 (tercera mayor). Los títulos quedan proporcionales entre sí y el sitio se ve más ordenado que con tamaños elegidos al azar.
¿Cómo funciona clamp()?
clamp(mínimo, preferido, máximo) deja que la fuente crezca con el ancho de la pantalla (el valor preferido usa vw) sin pasar los límites. Así, un título tiene un tamaño en el celular y otro en la computadora, sin media queries.
¿Por qué usar rem?
En rem, los tamaños respetan la configuración de tamaño de fuente del navegador de la persona, lo cual es importante para quien agranda la letra para leer mejor. La herramienta usa 1rem = 16px.
¿Es gratis de verdad?
Sí, 100% gratis. Sin registro, sin suscripción y sin límite de uso. Todas las herramientas de Tools123 son gratuitas.