Convertissez px, rem, em, pt et % avec un tableau en direct et du CSS prêt à copier

Valeur à convertir
px
px

rem est relatif à la police racine ; em et % sont relatifs au parent.

Valeurs converties
px
0
rem
0
em
0
pt
0
%
0
Valeurs courantes
PXREMEMPT
10
12
14
16
18
20
24
28
32
40
48
64
Extrait CSS

						

À propos de Convertisseur Pixel en EM/REM

Le convertisseur pixel vers EM/REM traduit les valeurs de longueur CSS entre px, rem, em, pt et pourcentage. Entrez une valeur dans l'une des cinq unités et un tableau en direct affiche son équivalent dans toutes les autres — ainsi qu'un extrait CSS prêt à copier que vous pouvez coller directement dans une feuille de style.

Les conversions respectent la façon dont CSS résout réellement les unités : rem est relatif à la taille de police racine, tandis que em et % sont relatifs à la taille de police de l'élément parent. Les deux tailles de référence sont modifiables, ce qui permet de modéliser une racine de 16 px avec un composant de 14 px, ou toute échelle de design system que vous utilisez.

Un tableau des valeurs courantes répertorie les tailles auxquelles les designers ont le plus souvent recours — ainsi des questions comme « combien font 24px en rem » trouvent une réponse en un coup d'œil. L'outil est gratuit, se met à jour au fur et à mesure de la saisie, et constitue un incontournable pour convertir des maquettes en pixels fixes vers du CSS accessible et évolutif basé sur rem.

Comment utiliser Convertisseur Pixel en EM/REM

  1. Entrez la valeur à convertir et sélectionnez son unité : px, rem, em, pt ou %.
  2. Ajustez la taille de police racine (pour rem) et la taille de police parente (pour em et %) si elles diffèrent de 16 px.
  3. Lisez les valeurs converties dans le tableau en direct.
  4. Copiez l'extrait CSS généré ou n'importe quelle valeur du tableau des valeurs courantes.

Questions fréquentes

rem est toujours relatif à la taille de police de la racine (html), tandis que em est relatif à la taille de police héritée de l'élément courant. Les valeurs em imbriquées se cumulent, c'est pourquoi rem est généralement plus prévisible pour la mise en page.

Avec la taille de police racine par défaut de 16 px, 16 px équivalent exactement à 1 rem. Changez le champ de taille racine et le convertisseur recalcule — avec une racine à 18 px, 16 px devient environ 0,889 rem.

Les valeurs rem s'adaptent lorsque les utilisateurs modifient la taille de police de base de leur navigateur, ce qui garde le texte lisible pour les personnes ayant besoin d'une police plus grande. Les tailles px fixes ignorent cette préférence, ce qui nuit à l'accessibilité.

CSS définit 1 pt comme 1/72 de pouce et 1 px comme 1/96, donc 1 pt = 1,333 px et 12 pt = 16 px. Les points apparaissent surtout dans les feuilles de style d'impression et les documents importés depuis des traitements de texte.

Pour la taille de police, % est relatif à la taille de police de l'élément parent, tout comme em : 100 % équivaut à la taille du parent, donc 87,5 % d'un parent de 16 px donne 14 px. Réglez le champ de taille parente pour correspondre à votre contexte.


Recherches populaires
convertisseur px en rem convertisseur px en em pixel en rem rem en px convertisseur unité css calculateur px em rem
Besoin d'aide ?
Un problème avec cet outil ? Signalez-le à notre équipe.
Signaler un problème

Ajoutez cet outil gratuit à votre propre site web — copiez-collez le code ci-dessous.