Conversor Em/Px

Convierte entre unidades CSS: px, em, rem, pt y %. Establece tu tamaño de fuente base y ve todas las conversiones al instante con una tabla de referencia rápida.

Base Font Size

px(browser default: 16px)

Convert a Value

px
16
em
1
rem
1
pt
12
%
100

Text Preview

The quick brown fox

Previewing at 16px

Quick Reference TableBase: 16px

pxemrempt%
80.50.5650%
100.6250.6257.562.5%
120.750.75975%
140.8750.87510.587.5%
161112100%
181.1251.12513.5112.5%
201.251.2515125%
241.51.518150%
281.751.7521175%
322224200%
362.252.2527225%
402.52.530250%
483336300%
644448400%
724.54.554450%
966672600%

All conversions happen entirely in your browser. No data is sent to any server.

Cómo usar Conversor Em/Px

  1. 1Establece tu tamaño de fuente base (predeterminado 16px).
  2. 2Ingresa un valor y selecciona la unidad de entrada.
  3. 3Ver conversiones a todas las otras unidades CSS al instante.
  4. 4Utiliza la tabla de referencia para tamaños de fuente comunes.
ZenovayAnalytics

Convierte tu tráfico en clientes.

  • Seguimiento de visitantes en tiempo real
  • Privacidad primero, sin aviso de cookies
  • Configurado en dos minutos
Descubre Zenovay

Preguntas frecuentes

¿Cuál es la diferencia entre em, rem y px?
px (píxeles) es una unidad absoluta basada en píxeles de pantalla. em es relativo al tamaño de fuente del elemento padre. rem es relativo al tamaño de fuente del elemento raíz (html). Con una raíz de 16px, 1rem = 16px. em se compone cuando está anidado (1.5em dentro de 1.5em = 2.25× el tamaño raíz); rem no.
¿Cuándo debo usar cada unidad CSS?
Usa rem para tamaños de fuente (se escala con las preferencias del usuario). Usa em para espaciado interno de componentes que debe escalar con el texto del componente. Usa px para bordes, sombras y elementos de tamaño fijo. Usa % para anchos y diseños. Usa vw/vh para tamaño relativo a la ventana gráfica.
¿Cuál es el tamaño de fuente base predeterminado?
Los navegadores predeterminan 16px para el tamaño de fuente raíz. Los usuarios pueden cambiar esto en la configuración del navegador para accesibilidad. Por eso 1rem = 16px por defecto, y por qué el uso de unidades rem respeta las preferencias del usuario mientras que px no.
¿Cómo afectan las unidades CSS al diseño receptivo?
Las unidades rem y em se escalan con la configuración del tamaño de fuente, lo que las hace amigables con capacidad de respuesta. La función CSS clamp() combina valores mín, preferido y máx: font-size: clamp(1rem, 2.5vw, 2rem). Las consultas de medios pueden ajustar el tamaño de fuente raíz, y todos los valores basados en rem se escalan proporcionalmente.
¿Cómo afectan las unidades CSS a la accesibilidad?
Los usuarios que aumentan el tamaño de fuente predeterminado de su navegador esperan que el texto se escale en consecuencia. Los tamaños de fuente basados en px ignoran esta preferencia. Los tamaños basados en rem la respetan. El Criterio de Éxito 1.4.4 de WCAG 2.1 requiere que el texto sea redimensionable hasta un 200% sin pérdida de contenido. El uso de rem para tamaños de fuente ayuda a cumplir este requisito.