Calculadora de CSS clamp()
Da un tamaño para un viewport pequeño y otro para uno grande. Obtienes el clamp() que se mueve suavemente entre ambos, en rem, para que siga respetando el tamaño de fuente del navegador del lector.
El veloz zorro pardo
Escala tipográfica
Por qué rem y no px
Un tamaño en px ignora el tamaño de fuente que el lector eligió en su navegador. La misma declaración en rem escala con él, así que quien puso 20px por defecto recibe texto más grande en vez de tu 16 fijo. El término del viewport sigue en vw de todos modos: eso va de ancho de pantalla, no de preferencia del lector.
Preguntas frecuentes
¿Qué hace el término del medio?
Es una recta que pasa por tus dos puntos: una ordenada al origen más una pendiente en vw. Por debajo del viewport pequeño se fija al mínimo; por encima del grande, al máximo.
¿Puede el máximo ser menor que el mínimo?
Sí, y clamp() sigue funcionando, pero el resultado se encoge según crece la pantalla, lo cual casi nunca es lo que quieres. La página lo avisa cuando ocurre.
¿Se envía algo a vuestros servidores?
No. Es aritmética en tu navegador; nada de lo que escribes sale de la página.
Hecho por el equipo de GO AI. Todas las herramientas gratuitas