Convertisseur Pixel / REM / EM (Unités CSS)
Guide
Convertisseur Pixels / REM / EM
Convertissez instantanément entre les unités CSS : pixels (px), root em (rem) et em. Ajustez la taille de police de base et regardez toutes les valeurs se mettre à jour en temps réel. Parfait pour les développeurs front-end traduisant les spécifications de conception en CSS.
Comment utiliser
Entrez une valeur dans l'un des trois champs d'unités — px, rem, ou em — et les deux autres se mettront à jour instantanément. Ajustez la taille de police de base (par défaut 16px) à l'aide du curseur ou du champ de saisie pour qu'elle corresponde à la taille de police racine de votre projet. Le tableau de référence ci-dessous montre les conversions courantes en un coup d'œil.
Caractéristiques
- Conversion bidirectionnelle – Modifiez px, rem ou em et tous les autres se mettent à jour instantanément
- Taille de police de base réglable – Le curseur et le champ de saisie se synchronisent, par défaut 16px
- Tableau de référence – Tailles courantes calculées automatiquement pour votre taille de police de base
- Mises à jour en temps réel – Entrée limitée pour des performances fluides
- Côté client uniquement – Aucune donnée envoyée à un serveur
FAQ
-
Quelle est la différence entre rem et em en CSS ?
rem (root em) est relatif à la taille de police de l'élément racine (html), ce qui le rend cohérent sur toute la page. em est relatif à la taille de police de l'élément parent, ce qui peut se composer dans les éléments imbriqués. rem est généralement préféré pour la cohérence de la mise en page.
-
Pourquoi 1rem est-il égal à 16px par défaut ?
Les navigateurs définissent une taille de police racine par défaut de 16px, sauf indication contraire. Donc 1rem = 16px, 0.5rem = 8px, 1.5rem = 24px. Si vous définissez html { font-size: 62.5%; }, alors 1rem = 10px, ce qui facilite les calculs.
-
Quand dois-je utiliser px au lieu de rem ou em ?
Utilisez px pour les valeurs qui ne doivent pas évoluer avec les préférences de police de l'utilisateur, comme les bordures, les ombres ou les points de rupture des requêtes média. Utilisez rem pour les tailles de police et l'espacement afin que votre mise en page respecte les paramètres d'accessibilité de l'utilisateur. Utilisez em pour le dimensionnement relatif aux composants.
-
Comment le zoom du navigateur affecte-t-il les unités CSS ?
Le zoom du navigateur met à l'échelle toutes les unités CSS proportionnellement, y compris px. C'est différent de la mise à l'échelle du texte au niveau du système d'exploitation. Cependant, si un utilisateur modifie la taille de police par défaut de son navigateur, les valeurs rem et em s'ajustent tandis que les valeurs px ne le font pas — ce qui rend rem/em meilleurs pour l'accessibilité.
Installez nos extensions
Ajoutez des outils IO à votre navigateur préféré pour un accès instantané et une recherche plus rapide
恵 Le Tableau de Bord Est Arrivé !
Tableau de Bord est une façon amusante de suivre vos jeux, toutes les données sont stockées dans votre navigateur. D'autres fonctionnalités arrivent bientôt !
Outils essentiels
Tout voir Nouveautés
Tout voirMise à jour: Notre dernier outil a été ajouté le 21 mars 2026
