Quelles unités CSS sont prises en charge ?

px, rem, em et pt. Les % et unités viewport (vw/vh) sont hors périmètre.

Qu’est-ce que la taille racine / de base ?

La taille en pixels utilisée comme 1rem (et ici comme 1em). La valeur par défaut est 16px, comme le `html` habituel ; changez-la si votre design system fixe une autre racine.

rem et em sont-ils identiques ici ?

Oui dans cet outil — même base. En CSS réel, rem dépend de la racine, tandis que em multiplie le font-size de l’élément courant (souvent le parent), donc les em imbriqués se cumulent.

Comment pt est-il converti ?

En CSS à 96dpi, 1pt = 96/72 px (≈ 1,333px). Les workflows d’impression à autre DPI diffèrent.

Unités CSS

px, rem, em et pt

Convertissez les valeurs CSS px, rem, em et pt avec une taille de police de base configurable pour tokens de design, typographie et mises en page responsives.

Cette conversion s’exécute uniquement dans votre navigateur — rien n’est téléversé.

Valeur

Unité

Taille racine / de base

Taille racine / de base16px
Unitépx

En CSS réel, em dépend du font-size du parent ; cet outil approxime rem et em avec la même valeur racine/base.

Qu'est-ce que cet outil ?

Convertissez px, rem, em et pt CSS avec une taille racine / de base configurable (16px par défaut). Pensé pour tokens de design, typographie et spacing responsive.

En CSS réel, rem dépend de la racine et em du font-size de l’élément courant (souvent le parent). Ici rem et em partagent la même base — traitez em comme une approximation. pt suit la convention CSS 96dpi (1pt = 96/72 px).

When to use

Traduire des px de maquette en rem pour échelles et spacing
Vérifier 1.5rem ou 12pt quand la racine n’est pas 16px
Documenter des tables de tokens px ↔ rem
Comparer des pt « print » au CSS écran

Comment utiliser

Saisissez la valeur et l’unité source.
Réglez la taille racine / de base en px (16 par défaut). Toutes les lignes se mettent à jour immédiatement.
Copiez une unité par ligne ou toutes les valeurs.
Si vous imbriquez des em, vérifiez le font-size calculé du parent.

Exemples

Entrée / réglage	Sortie	Notes
`16px`, base `16`	`16.00px; 1.0000rem; 1.0000em; 12.00pt`	Racine navigateur par défaut.
`24px`, base `16`	`24.00px; 1.5000rem; 1.5000em; 18.00pt`	Titre / spacing courant.
`1.5rem`, base `16`	`24.00px; 1.5000rem; 1.5000em; 18.00pt`	Relatif → pixels.
`12pt`, base `16`	`16.00px; 1.0000rem; 1.0000em; 12.00pt`	Cas limite CSS 96dpi.

Pièges courants

em dépend du parent. 1.2em dans un parent à 1.25em n’est pas 1.2 × racine ; les valeurs se cumulent. La colonne em suppose font-size = base.
Si vous changez le root (html { font-size: 62.5% }, etc.), alignez le champ base sur le px réel.
Le pt ici est l’unité absolue CSS à 96dpi, pas un point d’impression à un autre DPI.

Références

Dernière révision: 2026-07-27

Questions fréquentes

Quelles unités CSS sont prises en charge ?: px, rem, em et pt. Les % et unités viewport (vw/vh) sont hors périmètre.
Qu’est-ce que la taille racine / de base ?: La taille en pixels utilisée comme 1rem (et ici comme 1em). La valeur par défaut est 16px, comme le `html` habituel ; changez-la si votre design system fixe une autre racine.
rem et em sont-ils identiques ici ?: Oui dans cet outil — même base. En CSS réel, rem dépend de la racine, tandis que em multiplie le font-size de l’élément courant (souvent le parent), donc les em imbriqués se cumulent.
Comment pt est-il converti ?: En CSS à 96dpi, 1pt = 96/72 px (≈ 1,333px). Les workflows d’impression à autre DPI diffèrent.