Générateur de taille de police fluide avec clamp()
Calculez une véritable valeur CSS clamp() fluide à partir d'une taille min et d'une taille max sur deux largeurs de viewport, avec la pente et l'intersection détaillées pas à pas et un aperçu de redimensionnement en direct.
Entièrement traité dans votre navigateur — rien de ce que vous saisissez ici n'est jamais téléchargé.
Résultat
À propos de cet outil
Cette page ouvre le calculateur avec une configuration de taille de police fluide polyvalente déjà préremplie : 16px pour un viewport à 320px jusqu'à 24px pour un viewport à 1280px. Il s'agit d'une plage confortable allant d'une taille de corps de texte à une taille légèrement plus grande, qui s'adapte progressivement d'un écran de téléphone typique à une fenêtre de bureau standard, et c'est généralement la configuration recherchée lorsqu'on s'intéresse à une taille de police fluide clamp().
Les quatre nombres peuvent être modifiés : augmentez la taille max pour un titre plutôt que pour du corps de texte, ou réduisez la plage de viewport si la conception ne nécessite de s'adapter qu'entre un point d'arrêt tablette et un point d'arrêt bureau. Quelles que soient les valeurs saisies, la pente et l'intersection avec l'axe des ordonnées sont recalculées de la même façon et affichées sous forme de calculs explicites, au lieu d'être dissimulées dans la ligne finale.
Sous les quatre champs de saisie, un curseur de largeur de viewport pilote un aperçu en direct, de sorte que la mise à l'échelle soit immédiatement visible, et la ligne clamp() prête à copier est accessible en un clic. Passer l'unité de sortie de rem à px recalcule chaque nombre sans modifier les valeurs de taille min et max elles-mêmes.