Convertisseur px·rem·em

Saisissez une valeur en px et obtenez la conversion en rem et em pour n'importe quelle police de base, avec la sortie CSS prête à coller. Conversion bidirectionnelle incluse.
Convertisseur live
px Pixels — valeur absolue
rem Root EM — relatif au root
em EM — relatif au parent
Réglages de base
Root font-size (1rem) px
Contexte EM (police parent) px
rem = px ÷ 16
em = px ÷ 16 (contexte)
px = rem × 16
pt = px × 0.75   (96dpi)
Raccourcis typographie
px rem em pt % (base 16px) 

                                    

                                

                            

                        

                    


                    

                        
Le convertisseur px-rem est l'un des outils les plus recherchés par les développeurs front-end travaillant sur des thèmes WordPress, des systèmes de design et des architectures CSS évolutives. Utiliser des unités relatives comme rem et em est essentiel pour créer des mises en page accessibles, responsives et maintenables : les valeurs rem s'adaptent à la taille de police racine du navigateur, tandis que les valeurs em sont relatives à l'élément parent.
Avec cet outil vous pouvez :
  • Convertir toute valeur px en rem et em en temps réel
  • Définir une taille de police de base personnalisée (par défaut 16px)
  • Convertir dans la direction inverse (rem → px)
  • Copier la sortie CSS en un clic, prête à coller dans votre feuille de style
Particulièrement utile lors de la traduction d'une maquette Figma en code CSS : les fichiers de design utilisent souvent des pixels, mais la production requiert des unités relatives pour respecter les préférences d'accessibilité des utilisateurs.
Utiliser le convertisseur
  • Modifiez px, rem ou em : les deux autres champs se mettent à jour.
  • Réglez la root font-size (souvent 16px sur html) pour les rem.
  • Réglez le contexte EM sur la taille du parent pour les em.
  • Consultez le tableau (4–128px) et la sortie CSS (rem, em, pt, variable).
  • Copier le CSS et Copier placent le code dans le presse-papiers.
Utile pour les design systems, thèmes WordPress, Figma et l'accessibilité.