Conversor PX↔REM
Convierta píxeles a REM y viceversa con tabla de referencia y soporte Tailwind CSS. Tamaño base personalizable. Gratis.
Sin registro
·
100% gratis
·
Privado
px (root font-size)
Base Px Rem
px
1rem
rem
16px
Tabla de referencia Px Rem
| PX | REM | Px Rem Ejemplo |
|---|
Px Rem Tailwind Ref
| Tailwind | REM | PX |
|---|---|---|
| text-xs | 0.75rem | 12px |
| text-sm | 0.875rem | 14px |
| text-base | 1rem | 16px |
| text-lg | 1.125rem | 18px |
| text-xl | 1.25rem | 20px |
| text-2xl | 1.5rem | 24px |
| text-3xl | 1.875rem | 30px |
| text-4xl | 2.25rem | 36px |
¿Te fue útil esta herramienta?
¡Gracias por tu opinión!
Conversor PX a REM
El Convertidor PX a REM es una herramienta gratuita en línea para desarrolladores web que convierte entre unidades de píxeles (px) y rem utilizadas en CSS. Ingresa un valor en píxeles y ve al instante el equivalente en rem (basado en el tamaño de fuente raíz especificado), o ingresa rem para ver los píxeles equivalentes. La herramienta admite tamaños de fuente raíz personalizados (16px por defecto) y la conversión por lotes de múltiples valores a la vez, lo que la hace indispensable para flujos de trabajo de desarrollo web responsivo.En el CSS moderno, las unidades rem (root em) se prefieren sobre los píxeles para el diseño accesible porque se escalan proporcionalmente cuando los usuarios cambian el tamaño de fuente predeterminado de su navegador. Un rem equivale al tamaño de fuente del elemento raíz — típicamente 16px por defecto. Convertir diseños existentes basados en píxeles a unidades rem mejora la accesibilidad y el comportamiento responsivo. El convertidor muestra el equivalente exacto: 16px = 1rem (con raíz de 16px), 24px = 1,5rem, 32px = 2rem, etc. Ajusta el tamaño de fuente raíz para que coincida con el tamaño base de tu proyecto y obtener conversiones precisas.Los desarrolladores front-end convierten valores en píxeles de mockups de diseño (Figma, Sketch, Adobe XD) a rem para CSS responsivo. Los usuarios de frameworks CSS traducen valores de clases utilitarias entre sistemas. Los especialistas en accesibilidad verifican que los diseños basados en rem escalen correctamente a diferentes niveles de zoom del navegador. Los ingenieros de sistemas de diseño establecen escalas de espaciado y tipografía en unidades rem. Los desarrolladores principiantes que aprenden diseño responsivo usan el convertidor para desarrollar intuición sobre la relación px-rem.El Convertidor PX a REM es parte del kit de herramientas para desarrolladores de facilita.tools. Disponible en portugués, inglés y español, optimizado para navegadores de escritorio y móviles.
Preguntas Frecuentes
Cual es la diferencia entre px y rem en CSS?
Los pixeles (px) son unidades de tamano fijo que no cambian con la configuracion del usuario. REM (root em) son unidades relativas al tamano de fuente del elemento raiz (generalmente 16px). REM es preferido para accesibilidad porque respeta las preferencias de tamano de fuente del navegador del usuario.
Como convertir px a rem?
Divida el valor en pixeles por el tamano base de fuente (predeterminado 16px). Por ejemplo: 24px / 16 = 1.5rem. Si el tamano base de su fuente es diferente, ajuste: 24px / 14 = 1.714rem (para base de 14px).
Debo usar px o rem para tamanos de fuente?
Use rem para tamanos de fuente, margenes y padding para asegurar que su diseno escale con las preferencias del usuario. Use px para bordes, sombras y pequenos elementos decorativos donde el tamano consistente importa.