Générateur de CSS clamp()
Générez une valeur CSS clamp() fluide à partir de tailles min/max et de largeurs de fenêtre d'affichage.
Sortie
Saisissez une taille minimale et maximale ainsi que la plage de fenêtre d'affichage à laquelle elles s'appliquent, et obtenez une expression CSS clamp() prête à l'emploi pour une typographie ou un espacement fluides et adaptatifs.
Comment utiliser
- Saisissez la taille minimale et maximale en pixels.
- Saisissez la largeur minimale et maximale de la fenêtre d'affichage entre lesquelles les tailles doivent s'appliquer.
- Copiez la déclaration clamp() générée, en renommant éventuellement la propriété CSS.
Questions fréquentes
- Comment la valeur fluide est-elle calculée ?
- Elle calcule une pente linéaire entre les tailles min et max sur la plage de la fenêtre d'affichage, exprimée sous forme d'une formule rem + vw à l'intérieur de clamp().
- Pourquoi la sortie utilise-t-elle rem et vw ?
- rem maintient la taille de base relative aux réglages de police de l'utilisateur, tandis que vw la fait varier en douceur avec la largeur de la fenêtre d'affichage.
- Que se passe-t-il si ma fenêtre d'affichage max est plus petite que ma fenêtre d'affichage min ?
- L'outil affiche un message de validation vous demandant de rendre la largeur maximale de la fenêtre d'affichage supérieure à la minimale.