Conversor de PX a REM y EM
—
rem y em se calculan respecto al tamaño de fuente base (16px es el estándar de la mayoría de navegadores).
Sobre esta herramienta
Convierte unidades CSS entre píxeles (px), rem y em de forma instantánea, con un tamaño de fuente base configurable (16px por defecto, el estándar de la mayoría de navegadores). Herramienta esencial para desarrolladores frontend y diseñadores web que trabajan con diseño responsivo (responsive design), tipografía escalable, media queries y accesibilidad, ya que usar rem en lugar de px permite que el texto se adapte correctamente cuando el usuario cambia el tamaño de fuente de su navegador. Simplemente escribe el valor en píxeles y obtén automáticamente su equivalente en rem y em, o al revés. Todo el cálculo se hace en tiempo real en tu navegador, sin necesidad de abrir la consola de desarrollador ni hacer cuentas manuales. Ideal para maquetar en CSS, Tailwind, Sass o cualquier framework moderno que use unidades relativas para lograr interfaces más accesibles y escalables.
Preguntas frecuentes
¿Cómo se pasa de px a rem?
Divide los píxeles entre el tamaño de fuente base. Con la base de 16 px, que usan casi todos los navegadores, 24 px son 1.5 rem y 8 px son 0.5 rem. Al revés, 1.25 rem son 20 px.
¿Por qué usar rem en lugar de px?
Porque rem respeta el tamaño de letra que el usuario eligió en su navegador: si lo aumenta por accesibilidad, un diseño en rem crece con él, mientras que uno en px se queda fijo. Es una de las recomendaciones de accesibilidad más habituales.
¿Qué diferencia hay entre rem y em?
rem se calcula siempre respecto al tamaño de fuente del elemento raíz de la página; em, respecto al del elemento padre, así que se acumula al anidar. Esta herramienta trata em igual que rem, usando la misma base, lo que solo es exacto si el padre tiene el tamaño base.
¿Puedo cambiar el tamaño base?
Sí: el valor por defecto es 16 px, pero puedes poner otro, por ejemplo 10 si usas el truco de html con font-size del 62.5 %. Con base 10, 24 px son 2.4 rem. Pon la misma base que use tu proyecto.
¿Con cuántos decimales muestra el resultado?
Hasta cuatro. Por ejemplo, 13 px con base 16 da 0.8125 rem. Puedes redondear ese valor en tu CSS (0.8125rem se escribe tal cual, sin problema).
¿Y para márgenes, espacios y anchos?
También: rem sirve para cualquier medida de CSS, no solo para la letra, y mantiene proporcionados el texto y los espacios cuando cambia el tamaño base. Para anchos que dependen de la pantalla, suelen preferirse porcentajes o unidades de viewport.
Herramientas relacionadas
Conversor de Fahrenheit a Celsius
Convierte grados Fahrenheit, Celsius y Kelvin al instante
LocalConversor de Kilómetros a Millas
Convierte kilómetros, millas, metros y pies en segundos
LocalConversor de Kilogramos a Libras
Convierte kilogramos, libras, gramos y onzas al instante
LocalConversor de Litros a Galones
Convierte litros, galones, mililitros y cuartos al instante
LocalConversor de Bytes, KB, MB y GB
Convierte bytes, kilobytes, megabytes, gigabytes y terabytes
LocalConversor de HEX a RGB y CMYK
Convierte colores entre HEX, RGB, CMYK y HSL al instante