Sobre esta herramienta
La tipografía responsive tradicional salta entre tamaños fijos en cada punto de ruptura de media query: 16px en móvil y, de repente, 20px al superar cierto ancho. `clamp(MÍNIMO, PREFERIDO, MÁXIMO)` de CSS sustituye ese salto por un escalado continuo: el tamaño de fuente crece suavemente, en sincronía con el viewport, entre el mínimo y el máximo elegidos. Por debajo del ancho mínimo se "fija" en el tamaño mínimo; por encima del máximo, se fija en el máximo. Solo en el medio es flexible.
Esta calculadora hace la interpolación por ti: calcula la pendiente lineal entre tus tamaños de fuente mínimo y máximo a lo largo del rango de viewport elegido, la expresa como un valor preferido basado en `vw`, y envuelve todo en una cadena `clamp()` lista para pegar. Pega el resultado directamente en `font-size` (o cualquier otra propiedad numérica) — sin más overrides específicos de breakpoint para la escala tipográfica.
Preguntas frecuentes
¿Por qué usar clamp() en lugar de solo una media query?
Las media queries saltan entre tamaños fijos en los breakpoints, mientras que clamp() escala de forma suave y continua entre tu mínimo y máximo a medida que cambia el tamaño del viewport, sin "saltos" visibles en ningún ancho.
¿clamp() funciona en todos los navegadores?
Sí; CSS clamp() ha sido compatible con todos los navegadores principales (Chrome, Firefox, Safari, Edge) desde 2020, por lo que es seguro usarlo en producción sin un respaldo para prácticamente todas las audiencias hoy en día.