Calcolatore di clamp() CSS

Indica la dimensione per un viewport piccolo e quella per uno grande. Ottieni il clamp() che passa in modo fluido dall'una all'altra, in rem, così continua a rispettare la dimensione del carattere impostata nel browser di chi legge.

Viewport
Dimensione calcolata

La rapida volpe bruna

Scala tipografica

Perché rem e non px

Una dimensione in px ignora il corpo del testo che il lettore ha scelto nel browser. La stessa dichiarazione in rem si adatta a quella scelta: chi ha impostato 20px come default ottiene testo più grande invece dei tuoi 16 fissi. Il termine legato al viewport resta comunque in vw: quello riguarda la larghezza dello schermo, non la preferenza di chi legge.

Domande frequenti

Cosa fa il termine centrale?

È una retta che passa per i tuoi due punti: un'intercetta più una pendenza in vw. Sotto il viewport piccolo si blocca al minimo, sopra quello grande al massimo.

Il massimo può essere minore del minimo?

Sì, e clamp() continua a funzionare — ma il risultato si rimpicciolisce man mano che lo schermo cresce, e non è quasi mai quello che vuoi. La pagina te lo segnala quando succede.

Viene inviato qualcosa ai vostri server?

No. Sono solo calcoli fatti nel tuo browser; niente di ciò che scrivi esce dalla pagina.

Realizzato dal team GO AI. Tutti gli strumenti gratuiti