DevTulz Online

Convertidor PX ↔ REM

px

PX → REM

px

REM → PX

rem

Taula de referència

px rem em

Quina és la diferència entre PX i REM?

PX (píxels) és una unitat absoluta — sempre es renderitza amb la mateixa mida física. REM (root em) és una unitat relativa basada en la mida de la lletra de l'element arrel (normalment 16px per defecte als navegadors). L'ús de REM facilita la creació de dissenys accessibles i escalables que respecten les preferències de mida de lletra de l'usuari.

Com utilitzar el convertidor de PX a REM

  1. Estableix la mida base de la lletra (per defecte és 16px — coincideix amb la majoria de navegadors).

  2. Introdueix un valor en píxels per veure el valor equivalent en REM.

  3. O introdueix un valor en REM per convertir-lo de nou a píxels.

  4. Utilitza la taula de referència de sota per a les conversions de mides habituals.

Fórmula: rem = px ÷ mida base de la lletra. Per a la base per defecte de 16px: 1rem = 16px, 0.5rem = 8px, 1.5rem = 24px. Tots els càlculs es fan a l'instant al teu navegador.

Preguntes Freqüents

Hauria d'utilitzar rem o em per als tamanys de font? Utilitza rem per als tamanys de font i la majoria d'espaiat. rem és relatiu a la mida de la font arrel i és consistent al llarg del document. em és relatiu a la mida de la font de l'element pare, que es combina en elements imbricats i pot causar resultats inesperats. rem és generalment més fàcil de raonar.

Quina és la mida de font base? La majoria dels navegadors per defecte estableixen 16px per a la mida de la font arrel. Si el vostre CSS estableix html { font-size: 62.5%; } (un truc comú), la base es converteix en 10px, fent que els càlculs de rem siguin més simples: 1rem = 10px. Ajusteu la mida base d'aquesta eina per coincidir amb el vostre projecte.

Per què utilitzar rem en lloc de px per a l'accessibilitat? Els usuaris amb discapacitats visuals o dificultats de lectura poden augmentar la mida de font per defecte del navegador a la configuració d'accessibilitat. Les unitats px ignoren aquesta preferència. Les unitats rem i em s'escalen amb la preferència de l'usuari, fent que la interfície sigui més útil per a tots.

Keywords: convertidor px a rem, rem a px, píxels a rem, convertidor d'unitats CSS, convertidor de mida de lletra, disseny responsive, calculadora rem