FERMER LA PUB
Convertisseur d'Unités CSS
Convertisseur d'Unités CSS
Prend en charge la conversion entre les unités CSS telles que px, em, rem, %, vw, vh, offrant des paramètres de points d'arrêt réactifs. Calcule automatiquement les valeurs dépendantes du contexte, adapté au développement de mises en page réactives, à l'implémentation frontend et à l'adaptation de style.
🚀 Démarrage rapide
- Saisir valeur et unité : ex. 16 + px ou 1 + rem
- Choisir la Source et saisir la valeur, puis la Cible ; utiliser « Échanger » pour basculer rapidement.
- Mobile : flèche en haut à droite du tiroir pour passer Source/Cible.
- Réglages disponibles pour rem/em/%/vw/vh ; désactivés pour les unités absolues.
- Voir les résultats : les autres unités sont calculées instantanément et copiables
- Points de rupture : basculer mobile/tablette/bureau pour valider sur différents écrans
📌 Cas d’usage courants
- Usages : mise en page responsive, handoff design‑dev, corrélation densité/impression, conventions unifiées
🧭 Conseils d’utilisation
- Base : 16px en racine est courant et facilite rem ↔ px
- Texte en rem : favorise l'échelle globale et l'a11y ; em pour l'échelle locale des composants
- Mise en page avec unités viewport : combiner avec points de rupture et clamp/min/max
- Décimales & arrondi : garder une précision raisonnable pour la lisibilité
🎛️ Paramètres et contexte
- REM base (Root Font Size): determines rem ↔ px conversion. 16px is common on the web (1rem≈16px). Adjust when the design baseline differs.
- EM base (Parent Font Size): determines em and % (when reference is Font size). Useful for component‑local scaling.
- % de référence : choisissez Taille de police / Largeur / Hauteur selon le contexte (mise en page vs typographie).
- Préréglages de points de rupture : Mobile/Tablette/Bureau/Grand écran définissent aussi la taille du viewport pour une estimation rapide (ce n’est pas une media query à l’exécution).
- Viewport size: used for vw/vh/vmin/vmax and % (width/height). Real devices vary with address bars/safe areas/scrollbars.
- DPI (dots per inch): for pt/pc/in/cm/mm/q ↔ px. Web default 96; set device value for print/HiDPI.
- Conseils : 1) Utilisez 16px et 96 DPI comme bases courantes ; 2) Validez les mises en page en % avec des points de rupture ; 3) Ces paramètres servent à des estimations en phase de conception et ne remplacent pas le calcul final du navigateur.
⚠️ Limites & Compatibilité
- % varie selon la propriété (width/height/line‑height diffèrent) ; l'outil estime les cas courants
- ex/ch dépendent des métriques de police ; résultats variables selon polices/navigateurs
- Les unités viewport varient avec barres/aires sûres ; de légers écarts sont possibles
- Unités physiques ↔ px varient avec le DPI ; valider pour l'impression/HiDPI
🔒 Confidentialité & sécurité
- Tous les traitements s’effectuent dans votre navigateur ; aucune donnée ne quitte votre appareil
❓ FAQ
Différence entre rem et em ?
rem dépend de la racine (échelle globale prévisible) ; em du parent (idéal en local composant)
Faut‑il utiliser px ou rem ?
Préférez rem pour mise en page/texte (a11y) ; px convient aux icônes/bordures nettes
Pourquoi vw/vh diffèrent selon l'appareil ?
Barres d'adresse/aires sûres/scroll affectent le viewport ; combinez avec clamp()/min()/max() et breakpoints
Convertir des pixels écran en unités d'impression ?
Définir le DPI (p. ex. 96/72/300). Ici, estimation ; validez avec profils ICC/épreuves