Saltar al contenido
Logo de CrateX.app

CrateX.app

Convertidor de Unidades CSS

Convertidor de Unidades CSS

Convertidor de Unidades CSS: Admite la conversión entre unidades CSS como px, em, rem, %, vw, vh, proporcionando configuraciones de puntos de interrupción responsivos. Calcula automáticamente valores dependientes del contexto, adecuado para el desarrollo de diseños responsivos, implementación frontend y adaptación de estilos.

Píxeles
px
Toca para cambiar la unidad

Length Units

Typography

Viewport

Percentage

Relativo al tamaño de fuente raíz
rem
Toca para cambiar la unidad

Length Units

Typography

Viewport

Percentage
Convertidor de Unidades CSS

Inicio rápido

1
Introducir valor y unidad: p. ej., 16 + px o 1 + rem
2
Seleccione la unidad de Origen e introduzca el valor; luego elija la de Destino. Use “Intercambiar” para cambiar rápido.
3
Móvil: use la flecha superior derecha del cajón para alternar Origen/Destino.
4
Disponible para rem/em/%/vw/vh; deshabilitado en unidades absolutas.
5
Ver resultados: el resto de unidades se calculan al instante y pueden copiarse
6
Puntos de ruptura: alternar móvil/tableta/escritorio para validar en distintas pantallas

Escenarios comunes

Usos

maquetación adaptable, traspaso diseño‑desarrollo, correlación densidad/impresión, unificación de convenciones

Escenario adicional

rem to px, em convertidor y viewport units pueden resolverse en el mismo flujo para revisar el resultado antes de copiarlo o exportarlo.

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
Maquetación con viewport: combinar con breakpoints y límites (clamp/min/max) para evitar extremos
Decimales y redondeo: mantén precisión razonable para no perder legibilidad

Parámetros y contexto

REM base (Root Font Size): determina la conversión rem ↔ px. 16px es común (1rem≈16px). Ajusta cuando la base del diseño sea distinta.
EM base (Parent Font Size): determina em y % (cuando la referencia es Tamaño de fuente). Útil para escalado local de componentes.
Referencia de %: elige Tamaño de fuente / Ancho / Alto según el contexto (maquetación vs tipografía).
Presets de breakpoint: también fijan el tamaño de viewport para estimar rápidamente (no es una media query en tiempo de ejecución).
Tamaño de viewport para vw/vh/vmin/vmax y % (ancho/alto). Los dispositivos reales varían por barras, safe areas y barras de desplazamiento.
DPI (puntos por pulgada): para pt/pc/in/cm/mm/q ↔ px. Por defecto 96; para impresión/HiDPI configura el valor del dispositivo.
Consejos: 1) usa 16px y 96 DPI como base; 2) valida porcentajes de layout cambiando breakpoints; 3) son estimaciones de diseño, no la computación final del navegador.

Limitaciones y compatibilidad

% depende de la propiedad (width/height/line-height difieren); esta herramienta estima casos comunes
ex/ch dependen de métricas tipográficas; varían entre fuentes/navegadores
Las unidades de viewport varían con barras/zonas seguras; puede haber pequeñas discrepancias
Unidades físicas ↔ px varían con el DPI; en impresión/HiDPI, validar

Privacidad y seguridad

Todo el procesamiento se realiza localmente en tu navegador; puedes sustituir, borrar y volver a procesar el contenido actual en cualquier momento.

Preguntas frecuentes

4

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