Conversor de px a rem: px, rem, pt, em, mm
Última actualización:
rem se mide respecto a este tamaño, y aquí em y % también. En CSS, em y % dependen del elemento padre, así que solo coinciden con rem donde ningún padre cambia el tamaño de fuente.
1 px = 0,0625 remTodos los resultados
Tabla de referencia rápida: Píxel → Em raíz
| Valor (px) | Resultado (rem) |
|---|---|
| 1 px | 0,0625 rem |
| 8 px | 0,5 rem |
| 10 px | 0,625 rem |
| 12 px | 0,75 rem |
| 14 px | 0,875 rem |
| 16 px | 1 rem |
| 18 px | 1,125 rem |
| 20 px | 1,25 rem |
| 24 px | 1,5 rem |
| 32 px | 2 rem |
| 48 px | 3 rem |
| 64 px | 4 rem |
Sobre px, rem y pt
CSS fija 1 pulgada en 96 px, así que 1 pt, que es 1/72 de pulgada, equivale a 1,333 px, y 1 mm equivale a 3,78 px. rem y em son relativos: 1 rem es el tamaño de fuente de la raíz, 16 px en todos los navegadores principales salvo que el visitante lo cambie, así que 24 px son 1,5 rem. Si una hoja de estilos fija otro tamaño de raíz, introdúcelo como base encima de los campos. em sigue el tamaño de fuente del elemento padre, así que equivale a rem solo donde ningún padre lo cambia.
Tamaños habituales de texto y elementos
Con la base predeterminada de 16 px. CSS fija 1 pulgada en 96 px, así que las columnas pt y mm no cambian con la base; solo cambia la columna rem.
| Tamaño | rem | pt | mm |
|---|---|---|---|
| Texto de 10 pt (notas al pie) | 0,8333 | 10 | 3,528 |
| Tamaño de texto predeterminado de un navegador | 1 | 12 | 4,233 |
| Texto de 12 pt en un procesador de texto | 1 | 12 | 4,233 |
| Encabezado h2 predeterminado | 1,5 | 18 | 6,35 |
| Tamaño mínimo de objetivo en WCAG 2.2 (2.5.8) | 1,5 | 18 | 6,35 |
| Encabezado h1 predeterminado | 2 | 24 | 8,467 |
| 1 centímetro | 2,362 | 28,35 | 10 |
| 1 pulgada | 6 | 72 | 25,4 |
Historia del punto y del píxel
El texto se medía en puntos mucho antes de las pantallas: los fundidores de tipos necesitaban una sola unidad para fundir letras que encajaran. Los ordenadores fijaron el punto en 1/72 de pulgada.
- Pierre-Simon Fournier publicó una tabla de tamaños de tipos medidos en puntos tipográficos: su escala dividía la pulgada en 12 líneas y cada línea en 6 puntos.
- La asociación de fundidores de tipos de Estados Unidos adoptó un sistema de puntos para los cuerpos de tipo, en el que la nonpareil mide 6 puntos y la pica 12.
- Adobe presentó PostScript, cuya unidad de longitud en la página es 1/72 de pulgada: en palabras de Adobe, aproximadamente lo mismo que el punto usado en la imprenta.
- CSS 2.1 se convirtió en Recomendación del W3C. Fija 1 pulgada en 96 px y 72 pt, así que 1 px son 0,75 pt, y basa el píxel en un punto de una pantalla de 96 dpi vista a un brazo de distancia.
Fuentes:
- Fournier, Manuel typographique, vol. 1 (1764), pp. 130-132 (se abre en una pestaña nueva)
- The Inland Printer, vol. 4 (1886-1887) (se abre en una pestaña nueva)
- Adobe, PostScript Language Reference, 3rd edition (se abre en una pestaña nueva)
- W3C, CSS 2.1 (2011), 4.3.2 Lengths (se abre en una pestaña nueva)