Saltar al contenido

Convertidor de unidades CSS

Convierte unidades CSS 1:1 entre px, rem, em, %, vw, vh, vmin, vmax, pt, pc, in, cm, mm, q, ex y ch localmente, con ajustes de tamaño de fuente raíz, tamaño de fuente de referencia EM, viewport y referencia de porcentaje. Las unidades CSS absolutas usan la relación fija 1in = 96px.

px
Toca para cambiar la unidad

Unidades de longitud

Tipografía

Área visible

Porcentaje

rem
Toca para cambiar la unidad

Unidades de longitud

Tipografía

Área visible

Porcentaje

Convertidor de unidades CSS

Inicio rápido

1
Ingresa un valor y elige la unidad de origen
2
Elige la unidad de destino o usa Intercambiar para invertir
3
Configura raíz/referencia EM/%/viewport según necesites; para EM usa el tamaño de fuente real de la propiedad.
4
Copia el resultado convertido
5
Cambia presets de viewport para revisar vw/vh

Escenarios comunes

Usos

maquetación responsive, paso de diseño a desarrollo, correspondencia densidad/impresión, convenciones de estilo unificadas

Consejos de uso

Base: 16px en raíz es común y facilita el cálculo mental rem ↔ px
Texto en rem: favorece el escalado global y la accesibilidad; em para escalado local en componentes
Usa unidades de viewport para estimar la maquetación: combínalas con breakpoints y restricciones min/max para evitar extremos.
Decimales y redondeo: mantén precisión razonable para no perder legibilidad

Parámetros y contexto

Base REM (Root Font Size): determina la conversión rem ↔ px. 16px es común en la web (1rem≈16px). Ajústala cuando la base del diseño sea distinta.
Tamaño de fuente de referencia EM: introduce el tamaño de fuente que realmente utiliza la propiedad. em suele usar el tamaño de fuente calculado del elemento actual; para font-size y propiedades similares relativas a la fuente, usa el tamaño de fuente del padre. Esta referencia también se utiliza para aproximar ex/ch y para % cuando se selecciona Tamaño de fuente.
Referencia de %: elige Tamaño de fuente / Ancho / Alto según el contexto. Maquetación: ancho/alto; tipografía: tamaño de fuente.
Preajustes de breakpoint: móvil / tableta / escritorio / pantalla grande también fijan el viewport para estimar rápido. No es una media query en tiempo de ejecución.
Tamaño de viewport: se usa para vw/vh/vmin/vmax y % (ancho/alto). Los dispositivos reales varían por barras de direcciones, áreas seguras y barras de desplazamiento.
Consejos: 1) 16px es un valor habitual para la raíz y la referencia EM, pero debes usar el tamaño de fuente que realmente utiliza la propiedad; 2) verifica los porcentajes de maquetación cambiando de breakpoint; 3) estos controles ayudan a realizar estimaciones durante el diseño y no reemplazan el cálculo DOM/CSS final del navegador. Las unidades absolutas siempre usan 1in = 96px.

Limitaciones y compatibilidad

La referencia de % depende de la propiedad CSS, el bloque contenedor y el modo de maquetación; esta herramienta usa el tamaño de fuente, ancho de viewport o alto de viewport elegido para estimar, no una medición real del padre/contenedor.
ex/ch son aproximaciones basadas aquí en el tamaño de fuente de referencia EM; los resultados no proceden de una inspección de las métricas de la fuente y varían según la fuente y el navegador.
Los vw/vh/vmin/vmax clásicos varían con barras de desplazamiento, barras de direcciones y áreas seguras; esta herramienta no calcula dvh/svh/lvh, vi/vb, safe-area ni unidades de consulta de contenedor.
Las conversiones de unidades CSS absolutas usan la relación fija 1in = 96px. Relacionar los píxeles físicos de la pantalla con el tamaño impreso requiere un flujo de trabajo independiente para el dispositivo o la impresión, que esta herramienta no ofrece.

Privacidad y seguridad

El procesamiento se ejecuta en el navegador. El valor de entrada, las unidades de origen/destino, los valores almacenados en caché por unidad, el tamaño de fuente raíz, el tamaño de fuente de referencia EM, el viewport, la referencia de porcentaje y la elección de breakpoint pueden permanecer en la sesión actual o en el almacenamiento del navegador. Si guardas un espacio de trabajo o activas la sincronización WebDAV, esos valores pueden guardarse según tu configuración de sincronización. Los resultados convertidos se recalculan a partir del valor, las unidades y los ajustes de contexto actuales, y no se almacenan como resultados independientes. Esta página no recupera URL ni envía valores para convertirlos en el servidor. En dispositivos compartidos, borra los valores, los ajustes y los datos del sitio cuando sea necesario.

Preguntas frecuentes

4

Continúa con estas herramientas relacionadas para el siguiente paso.

Todo el procesamiento de las herramientas ocurre localmente en tu navegador.