Convierte px, em, rem, pt y % con un tamaño de fuente base configurable — tabla de equivalencias completa en tu navegador.
CSS mide las longitudes en varias unidades que al final acaban siendo píxeles en pantalla, y convertir entre ellas a mano es una molestia diaria del trabajo front-end. Este conversor toma un valor — en px, em, rem, pt o porcentaje — y muestra la misma longitud en las cinco unidades a la vez, usando un tamaño de fuente base que tú controlas. La base por defecto es 16 px, el tamaño de fuente inicial de todos los navegadores principales, pero si tu sistema de diseño define html { font-size: 62.5% } o cualquier otro tamaño raíz, cambia la base y toda la tabla se adapta.
Las relaciones son lineales y la herramienta muestra las fórmulas que aplica: los valores em y rem se multiplican por el tamaño de fuente base para obtener píxeles, los puntos se convierten con la proporción definida por CSS de 96 px por 72 pt (así que 1 pt = 1,333 px) y los porcentajes se leen respecto a la base, exactamente igual que em. Una salvedad honesta que la herramienta indica en pantalla: em y rem dan resultados idénticos aquí porque se usa una única base para ambos. En una página real difieren — rem siempre se refiere al elemento raíz, mientras que em se refiere al tamaño de fuente del elemento actual, que a su vez puede estar escalado por sus padres.
Usos típicos: traducir una entrega de diseño en píxeles a los valores rem que tu base de código estandariza, comprobar a cuánto equivale 0.875 rem antes de escribir una media query, convertir tamaños en pt orientados a impresión de una guía de estilo a unidades de pantalla, o definir escalas tipográficas accesibles que respeten la configuración del navegador del usuario. La conversión se ejecuta 100% en tu navegador mientras escribes — nada se sube y no hay nada que instalar.
px = em × base; px = rem × base; px = pt × 96 ÷ 72; px = % ÷ 100 × base. Inversa: em = rem = px ÷ base; pt = px × 72 ÷ 96; % = px ÷ base × 100. Con la base por defecto de 16 px: 1.5 em = 24 px = 18 pt = 150%.
rem siempre es relativo al tamaño de fuente de la raíz (html), mientras que em es relativo al tamaño de fuente del elemento actual, que se hereda y se acumula a través del árbol. Este conversor usa una sola base para ambos, así que aquí los números coinciden; en elementos anidados pueden divergir.
Porque todos los navegadores principales vienen con un tamaño de fuente inicial de 16 px, así que 1 rem = 16 px en una página sin modificar. Si tu CSS cambia el tamaño raíz — el popular truco del 62.5% hace que 1 rem = 10 px — pon ese valor en el campo de la base.
Multiplica por 72 y divide entre 96: CSS fija la proporción en 96 px por pulgada y 72 pt por pulgada, así que 16 px = 12 pt. La unidad pt importa sobre todo para hojas de estilo de impresión y documentos.
En general se recomienda rem para la tipografía porque escala cuando los usuarios cambian el tamaño de fuente preferido del navegador, cosa que px ignora. px sigue siendo válido para lo que no debe escalar con el texto, como bordes o sombras.
No. La conversión es un puñado de multiplicaciones hechas en JavaScript en tu dispositivo — nada se envía a ningún servidor ni se almacena en ningún lugar.
Vai.la convierte cualquier URL en un enlace corto con estadísticas de clics, código QR y tu propio biolink.
Vai.la no se hace responsable del uso de las herramientas ni de las decisiones tomadas a partir de sus resultados.