Unidades CSS

px, rem, em y pt

Convierte valores CSS px, rem, em y pt con tamaño de fuente base configurable para tokens de diseño, tipografía y layouts responsivos.

Esta conversión se ejecuta solo en tu navegador; no se sube nada.

px
  • Tamaño raíz / base16px
  • Unidadpx

En CSS real, em depende del font-size del padre; esta herramienta aproxima rem y em con el mismo valor raíz/base.

  • px
  • rem
  • em
  • pt

¿Qué es esta herramienta?

Convierte px, rem, em y pt de CSS con un tamaño raíz / base configurable (por defecto 16px). Sirve para tokens de diseño, tipografía y spacing responsivo.

En CSS real, rem mira la raíz y em el font-size del elemento actual (a menudo el padre). Aquí rem y em comparten la misma base: trata el em como aproximación. pt sigue la convención CSS a 96dpi (1pt = 96/72 px).

When to use

  • Pasar píxeles de diseño a rem en escalas tipográficas y spacing
  • Comprobar 1.5rem o 12pt cuando la raíz no es 16px
  • Documentar tablas de tokens px ↔ rem
  • Contrastar pt orientados a impresión con CSS de pantalla

Cómo usar

  1. Introduce el número y la unidad de origen.
  2. Ajusta el tamaño raíz / base en px (16 por defecto). Todas las filas se actualizan al instante.
  3. Copia una unidad por fila o todas a la vez.
  4. Si anidas em en CSS, verifica el font-size computado del padre.

Ejemplos

Entrada / configuraciónSalidaNotas
16px, base 1616.00px; 1.0000rem; 1.0000em; 12.00ptRaíz por defecto del navegador.
24px, base 1624.00px; 1.5000rem; 1.5000em; 18.00ptTítulo / spacing habitual.
1.5rem, base 1624.00px; 1.5000rem; 1.5000em; 18.00ptRelativo → píxeles.
12pt, base 1616.00px; 1.0000rem; 1.0000em; 12.00ptBorde CSS 96dpi.

Errores prácticos

  • em depende del padre. 1.2em dentro de un padre a 1.25em no es 1.2 × raíz; se acumula. La columna em asume font-size = base.
  • Si cambias el root (html { font-size: 62.5% }, etc.), alinea el campo base con el px real.
  • El pt aquí es la unidad absoluta CSS a 96dpi, no puntos de impresión a otro DPI.

Referencias

Última revisión: 2026-07-27

Preguntas frecuentes

¿Qué unidades CSS admite?
px, rem, em y pt. % y unidades de viewport (vw/vh) quedan fuera de alcance.
¿Qué es el tamaño raíz / base?
El tamaño en píxeles usado como 1rem (y aquí también como 1em). El valor por defecto es 16px, como el `html` habitual; cámbialo si tu sistema de diseño usa otra raíz.
¿rem y em son iguales aquí?
En esta herramienta sí usan la misma base. En CSS real, rem mira la raíz y em multiplica el font-size del elemento actual (a menudo el padre), así que los em anidados se acumulan.
¿Cómo se convierte pt?
En CSS a 96dpi, 1pt = 96/72 px (≈ 1,333px). Los flujos de impresión con otro DPI difieren.