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.5remo12ptcuando 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
- Introduce el número y la unidad de origen.
- Ajusta el tamaño raíz / base en px (16 por defecto). Todas las filas se actualizan al instante.
- Copia una unidad por fila o todas a la vez.
- Si anidas
emen CSS, verifica el font-size computado del padre.
Ejemplos
| Entrada / configuración | Salida | Notas |
|---|---|---|
16px, base 16 | 16.00px; 1.0000rem; 1.0000em; 12.00pt | Raíz por defecto del navegador. |
24px, base 16 | 24.00px; 1.5000rem; 1.5000em; 18.00pt | Título / spacing habitual. |
1.5rem, base 16 | 24.00px; 1.5000rem; 1.5000em; 18.00pt | Relativo → píxeles. |
12pt, base 16 | 16.00px; 1.0000rem; 1.0000em; 12.00pt | Borde CSS 96dpi. |
Errores prácticos
- em depende del padre.
1.2emdentro de un padre a1.25emno es1.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.