Conversor de unidades CSS
Convierte px, rem, em, pt y las demás unidades de longitud de CSS.
Rellena los campos y el resultado aparecerá aquí automáticamente.
Compara longitudes CSS mediante el píxel CSS con bases explícitas para rem y em. Las relaciones fijas son 1in=96px, 1pt=96/72px y 1pc=16px. rem usa el tamaño de fuente calculado de la raíz. En propiedades ordinarias, em usa la fuente calculada del propio elemento; en font-size usa el tamaño heredado. El campo «Base em» permite indicar el contexto correspondiente sin suponer anidamiento.
Cómo funciona
Fórmula y lógica
Cada unidad tiene un factor f en píxeles CSS. Resultado = valor·forigen/fdestino. rem usa el tamaño raíz y em la base indicada; 1cm=96/2,54px y 1mm=96/25,4px. Ambas bases deben ser positivas porque también se usan en las filas comparativas. Se admiten cero y longitudes negativas en la aritmética, aunque una propiedad CSS concreta pueda prohibirlas.
Ejemplo
Con una raíz de 16 px, 24 px son 1,5 rem y 18 pt.
Campos y unidades
- Valor — px
- Unidad de origen — opción de la lista
- Unidad de destino — opción de la lista
- Tamaño de fuente raíz — px
- Base em — px
Cómo se usa
- — Selecciona las unidades de origen y destino e introduce la longitud.
- — Indica la fuente raíz calculada y la base em correspondiente en píxeles CSS.
- — La etiqueta del resultado indica la unidad de destino; las comparaciones usan las mismas bases.
Método y limitaciones
- Método de cálculo
- Fórmula y lógica
- Fuente de datos o norma
- W3C CSS Values 3: bases em/rem y unidades absolutas (borrador)
- Limitación
- Conversión de longitudes CSS con el contexto indicado; no mide la densidad de pantalla ni valida la longitud para una propiedad específica.
FAQ
¿En qué se distinguen rem y em?
rem usa la fuente raíz calculada. En margin o width, em depende de la fuente del propio elemento; en font-size depende del tamaño heredado. Introduce la base que corresponda a esa propiedad.
¿Un centímetro CSS es un centímetro físico?
La proporción cm/px es fija: 1cm=96/2,54px. El tamaño físico depende del anclaje de las unidades absolutas en el dispositivo; no se garantiza que coincida con una regla en pantalla.
¿px desactiva el zoom del navegador?
No. El zoom de página funciona también con px. rem puede seguir la fuente raíz del usuario; la accesibilidad debe evaluarse en el diseño real.
¿62,5% siempre produce una raíz de 10px?
Solo si el tamaño inicial es 16px: 0,625·16=10. Con una fuente inicial de 20px se obtienen 12,5px. Aquí se introduce el tamaño calculado real.