Convertidor PX ↔ REM ↔ EM ↔ PT

Convierte unidades CSS en ambos sentidos con un tamaño raíz configurable — px, rem, em y pt se actualizan juntos.

538 visitas

Cómo se relacionan las unidades

rem = px ÷ tamaño raíz (16 px por defecto, así que 24 px = 1.5rem); em funciona igual pero respecto al tamaño de fuente heredado del propio elemento — el campo "tamaño de contexto" del convertidor; pt es la unidad de impresión, con 1pt = 1,333px (96dpi ÷ 72). Escribe en cualquier campo y los demás se actualizan.

Regla práctica: usa rem para tamaños de fuente y espaciados, así las preferencias de tamaño de fuente del usuario escalan todo el diseño; em para paddings que deben seguir el texto de su propio componente; px solo para lo que no debe escalar nunca (bordes de un píxel). Cambiar la raíz a 10 px (el viejo truco del 62,5%) facilita el cálculo mental, pero conviene evitarlo en proyectos nuevos — las librerías de componentes asumen 16.

Preguntas Frecuentes

¿Por qué mi valor en em difiere del de rem?

em se multiplica por el tamaño de fuente definido más cercano, y se anida: un 1.5em dentro de un elemento de 1.5em equivale a 2,25× la raíz. rem siempre hace referencia a la raíz — esa previsibilidad es la razón de su éxito.

¿1pt es realmente 1,333px?

En CSS, sí por definición: 1in = 96px = 72pt. Los PDF de impresión y CSS coinciden en esta proporción, aunque el tamaño físico depende del DPI real de la pantalla.

Herramientas Similares