Passer au contenu
Logo de CrateX.app

CrateX.app

Convertisseur d'Unités CSS

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.

Pixels
px
Touchez pour changer d’unité

Length Units

Typography

Viewport

Percentage

Relatif à la taille de police racine
rem
Touchez pour changer d’unité

Length Units

Typography

Viewport

Percentage
Convertisseur d'Unités CSS

Démarrage rapide

1
Saisir valeur et unité : ex. 16 + px ou 1 + rem
2
Choisir la Source et saisir la valeur, puis la Cible ; utiliser « Échanger » pour basculer rapidement.
3
Mobile : flèche en haut à droite du tiroir pour passer Source/Cible.
4
Réglages disponibles pour rem/em/%/vw/vh ; désactivés pour les unités absolues.
5
Voir les résultats : les autres unités sont calculées instantanément et copiables
6
Points de rupture : basculer mobile/tablette/bureau pour valider sur différents écrans

Scénarios courants

Usages 

mise en page responsive, handoff design‑dev, corrélation densité/impression, conventions unifiées

Scénario complémentaire

rem to px, em convertisseur et viewport units peuvent être pris en charge dans le même flux afin de vérifier le résultat avant copie ou export.

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.

Limitations et 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

4

Poursuivez avec ces outils associés pour l’étape suivante.