Este convertidor de PX a PT es una herramienta ligera que funciona en el navegador y convierte al instante entre píxeles y puntos para proyectos de pantalla e impresión.
Características clave:
- Conversión bidireccional: escribe cualquiera de los campos y el resto se actualizará en tiempo real
- DPI modo alternar: cambia entre Pantalla (96 ppp) e Imprimir (72 ppp) para que coincida con tu contexto
- Visualización de fórmulas en vivo: muestra la multiplicación exacta utilizada para que comprendas las matemáticas, no solo el resultado
- Referencia de valores comunes - 12 chips en los que se puede hacer clic para tamaños utilizados con frecuencia como 8px, 16px, 24px, 64px
- Copiar botones: tome cualquier valor al portapapeles con un solo clic
- Swap - invierte la dirección de conversión sin volver a escribir
Útil para diseñadores que se mueven entre Figma, CSS y documentos impresos. La barra de fórmulas también la convierte en una herramienta de aprendizaje, no solo en una calculadora.
Cómo utilizar este convertidor de PX a PT
Elige Pantalla (96 ppp) o Imprimir (72 ppp) en la parte superior del convertidor de arriba, luego escriba un valor en cualquiera de los campos. El otro campo se actualiza a medida que escribe y la barra de fórmulas muestra la multiplicación exacta detrás del resultado.
Las 12 fichas debajo de los campos completan tamaños comunes con un solo clic. Usa el botón de intercambio para cambiar la dirección y los botones de copiar para tomar cualquier valor.
La opción DPI es importante porque los píxeles y los puntos solo se alinean a 72 ppp. En el estándar de 96 ppp que utilizan la mayoría de las pantallas y todos los navegadores, 1 px equivale a 0,75 puntos. Es por eso que asumir 1px = 1pt rompe cosas en producción.
La fórmula de PX a PT
La fórmula general depende de la densidad de píxeles del entorno de salida:
pt = px × 72 ÷ PPI
PPI es la variable que la mayoría de la gente olvida. En el estándar web 96 PPI, 72 ÷ 96 equivale a 0.75, lo que proporciona el acceso directo a cada convertidor y cada CSS hoja de estilo de impresión se basa en:
pt = px × 0.75
- 16px → 12pt
- 24px → 18pt
- 32px → 24pt
- 10 píxeles → 7,5 puntos
El CSS Módulo de Valores y Unidades (EN) del W3C corrige esa relación directamente: un CSS píxel equivale a 1/96 de pulgada y un punto equivale a 1/72 de pulgada. Esa cifra de 1/96 es la misma que se utiliza para calcular cuántos píxeles caben en una pulgada (EN) en una pantalla estándar.
En 72 PPI, los píxeles y los puntos son iguales: 1px = 1pt. De aquí viene el mito de "son iguales". Sólo se mantiene en 72 PPI, lo cual es poco común en las pantallas modernas.
El redondeo importa aquí. Los valores que no se dividen uniformemente producen decimales largos y la mayoría de las herramientas de diseño redondean a uno o dos decimales en lugar de mostrar el número completo. Una configuración de diseñador de 10 px obtiene exactamente 7,5 pt, pero 15 px llega a 11,25 pt.
PT a PX: la fórmula inversa
Volviendo de los puntos a los píxeles en 96 PPI, divida por 0.75 o multiplique por 1.333:
px = pt ÷ 0.75
- 12 puntos → 16 píxeles
- 9 puntos → 12 píxeles
- 18pt → 24px
- 11 puntos (valor predeterminado de Word) → 14,67 px
La relación es fija y simétrica, ya que ambas unidades se remontan a la misma pulgada. Escribe un valor en el campo Puntos del convertidor de arriba para ejecutarlo.
Tabla de conversión de PX a PT
Valores de referencia al 96 PPI:
| px | PT |
|---|---|
| 8px | 6pt |
| 10px | 7.5pt |
| 12px | 9pt |
| 14px | 10.5pt |
| 16px | 12pt |
| 18px | 13.5pt |
| 24px | 18pt |
| 32px | 24pt |
| 48px | 36pt |
| 64px | 48pt |
| 72px | 54pt |
| 96px | 72pt |
El texto del cuerpo estándar se encuentra en 16px / 12pt. Ese emparejamiento es importante porque 16px es el tamaño de fuente predeterminado que todos los principales navegadores muestran bajo la palabra clave mediana CSS. Los títulos y los tamaños de visualización aumentan de forma predecible a partir de ahí.
¿Necesita el valor de píxel en una unidad física diferente? Una herramienta de conversión de píxeles a pulgadas dedicada maneja eso por sí sola, y un convertidor de píxel a centímetros similar cubre el lado métrico.
¿Qué es un convertidor de PX a PT?
Un convertidor de PX a PT es una calculadora que convierte valores de píxeles en valores de puntos para tipografía, diseños de impresión y software de diseño.
Existe porque CSS (EN) representa el texto en la pantalla en píxeles, mientras que las herramientas de impresión y diseño de página miden el texto y el espaciado en puntos. Sin una conversión fija, una fuente que se ve bien en la pantalla puede imprimirse con un tamaño completamente incorrecto.
Los diseñadores recurren a un PX a PT Converter en algunas situaciones recurrentes:
- Exportar una maqueta web a un PDF listo para imprimir
- Configurar tamaños de fuente para un documento destinado a imprimirse, no a verse en pantalla
- Coincidencia de especificaciones tipográficas entre un equipo web y un equipo de impresión
- Traducir tamaños de fuente CSS a valores en puntos para una guía de estilo
La herramienta se diferencia de un conversor de unidades general porque asume un contexto tipográfico, no uno simple de medición física. Alimentarlo con un valor de píxel destinado a pulgadas o centímetros da una respuesta técnicamente correcta pero prácticamente inútil, ya que esas unidades no llevan la herencia de impresión que tienen los puntos.
El Manual de referencia del lenguaje PostScript de Adobe fijó el punto en exactamente 1/72 de pulgada en 1985, reemplazando la punta de impresora ligeramente más pequeña de 1/72.27 pulgadas que había gobernado el tipo desde 1886. Esa única decisión es la razón por la que un px moderno La conversión pt produce un número consistente y predecible en lugar de los tamaños en puntos fraccionarios que las imprentas más antiguas tenían que solucionar.
PX vs PT: lo que diferencia a estas unidades
Los píxeles y los puntos provienen de dos tradiciones de medición diferentes, y esa es la razón por la que es necesario un convertidor.
Un píxel está vinculado a la pantalla, un punto está vinculado a la página impresa y ninguno se ajusta para coincidir con el otro automáticamente.
¿Qué es un píxel (PX)?
Pixel es la abreviatura de elemento de imagen, la unidad más pequeña que puede representar una pantalla. Los píxeles dependen de la pantalla: una fuente de 16 píxeles en un monitor de 96 PPI se ve diferente a una fuente de 16 píxeles en una pantalla de 72 PPI.
- Un CSS píxel es una unidad de referencia fija, no es lo mismo que un punto físico en un monitor
- Su tamaño renderizado cambia dependiendo de la pantalla en la que se muestra.
- Las pantallas de alta densidad contienen más puntos físicos en el espacio de un CSS píxel
Las pantallas Retina de Apple son el ejemplo más claro de este efecto de densidad de píxeles (EN), que duplica el recuento de puntos físicos de modo que un CSS píxel abarca dos píxeles del dispositivo en cada dirección.
¿Qué es un punto (PT)?
Punto es una unidad tipográfica que precede en siglos a las pantallas de computadora y se utiliza en impresión y composición tipográfica.
Un punto equivale a 1/72 de pulgada, una medida física fija que no cambia según el dispositivo o la pantalla.
Doce puntos forman una pica, otra unidad tipográfica que aparece mucho más en el software de diseño de páginas que en la web.
Debido a que los puntos están anclados a una pulgada física, el mismo valor de punto se imprime con el mismo tamaño sin importar qué impresora o software produjo el archivo.
Por qué DPI cambia la conversión de PX a PT
DPI decide cuántos puntos físicos representan una pulgada, y la proporción de 0.75 solo se cumple en el estándar 96 DPI integrado en CSS.
Cambia el DPI (EN) y el mismo número de píxeles ya no equivale al mismo tamaño físico.
Las imprentas comerciales generalmente requieren 300 DPI (EN) para obtener resultados nítidos, en comparación con los 72 a 96 DPI que representan la mayoría de las pantallas. Pautas de carga de Vistaprint (EN), por ejemplo, establece 300 DPI en el tamaño de impresión final como mínimo.
| Estándar de DPI | Uso típico | Efecto sobre PX a PT |
|---|---|---|
| 72 DPI | Pantalla heredada y primeras pantallas de Mac | 1 px = 1 punto |
| 96 DPI | Navegadores web modernos, CSS predeterminados | 1px = 0,75pt, la proporción estándar |
| 300 DPI | Producción de impresión profesional | 1 px = 0,24 puntos; la proporción debe ser recalculada |
Una conversión de píxel a punto creada para uso en pantalla parece correcta en un navegador, pero resulta demasiado pequeña una vez que alcanza una tirada de 300 DPI.
Cuándo utilizar PX frente a PT en el trabajo de diseño
El trabajo de pantalla requiere px, el trabajo de impresión requiere pt, y mezclar los dos dentro de un flujo de trabajo crea dolores de cabeza con el tamaño.
Píxeles (px):
- Coincide exactamente con las pantallas y ventanas gráficas del dispositivo
- Ignora el tamaño físico, por lo que un diseño que se ve directamente en la pantalla puede imprimirse mucho más pequeño o más grande de lo esperado.
Puntos (pt):
- Mantiene un tamaño físico fijo en papel sin importar qué dispositivo abrió el archivo
- No se asigna claramente a las cuadrículas de pantalla basadas en píxeles, por lo que las vistas previas en pantalla pueden verse ligeramente desviadas
Muchos equipos de diseño estandarizan el espaciado utilizando un sistema de cuadrícula de 8 puntos (EN), que mantiene cada medida en px y al mismo tiempo escala limpiamente una vez que se convierte para imprimir.
Eso funciona porque los múltiplos de 8px se convierten en valores de puntos redondos sin restos de decimales.
Los equipos que crean primero la pantalla para múltiples dispositivos tienden a apoyarse en prácticas de diseño responsivo (EN), donde px todavía ancla la mayoría de las mediciones incluso cuando los diseños se adaptan a diferentes pantallas.
PX vs PT vs EM vs REM: Elegir la unidad CSS adecuada
Pt rara vez aparece en el día a día CSS, ya que los navegadores utilizan de forma predeterminada px, em y rem para el tamaño de pantalla.
Su función principal en CSS es imprimir hojas de estilo, donde una unidad física fija importa más que una escalable.
La WCAG 1.4.4 (EN) del W3C requiere que se pueda cambiar el tamaño del texto hasta 200% sin perder contenido o función. Esa es una barrera que las unidades fijas como px y pt luchan por eliminar por sí solas.
| Unidad | Tipo | Cambia de tamaño según | Uso típico |
|---|---|---|---|
| px | absoluto | Nada, tamaño fijo | Diseños de pantalla, bordes. |
| pt | absoluto | Nada, tamaño fijo | Imprimir hojas de estilo, composición tipográfica |
| em | relativo | Tamaño de fuente del elemento principal | Dimensionamiento a nivel de componente |
| rem | relativo | Tamaño de fuente del elemento raíz | Escala global de fuente y espaciado |
La diferencia entre em y rem (EN) hace tropezar a muchos recién llegados, ya que ambos escalan en relación con el tamaño de fuente pero hacen referencia a diferentes elementos.
Las pautas para accesibilidad web (EN) generalmente favorecen rem y em sobre px o pt para texto, ya que las unidades relativas respetan la configuración del navegador del usuario.
Pt mantiene su lugar para las hojas de estilo específicas de impresión, pero sigue siendo un actor menor en el resto de CSS.
¿Qué software utiliza PT frente a PX de forma predeterminada?
Los navegadores y las herramientas basadas en pantalla tienen el valor predeterminado px, mientras que el software de impresión y procesamiento de texto tiene el valor predeterminado pt.
La división se alinea con el resultado para el que se creó cada programa.
| Software | Unidad predeterminada | Construido para |
|---|---|---|
| Navegadores web / CSS | px | Representación de pantalla |
| Adobe InDesign | Picas y puntos | Diseño de impresión |
| Microsoft Word | Puntos | documentos, impresión |
| Figma | px solamente | Diseño de pantalla y UI |
InDesign se entrega con picas como unidad de regla predeterminada para nuevos documentos impresos, aunque el tamaño de la letra en sí siempre se establece en puntos, como lo establece la documentación de unidades de medida de Adobe (EN).
Word maneja esto aún más directamente: su Font. Size propiedad (EN) devuelve y establece el tamaño de fuente en puntos, y un documento en blanco tiene como valor predeterminado Calibri de 11 puntos.
Figma se encuentra completamente en el otro extremo. La propia documentación de Figma (EN) muestra cada campo de dimensión en píxeles, sin ninguna opción de punto integrada en la interfaz.
Esa brecha causa una fricción real cuando una especificación tipográfica escrita en puntos para impresión se entrega a un equipo que trabaja en una herramienta de solo píxeles. Alguien tiene que convertirlo en una dirección y viceversa.
Las diferencias de representación agravan el problema entre programas, lo cual es parte de por qué las pruebas de compatibilidad entre navegadores (EN) son importantes para cualquier diseño que combine ambos tipos de unidades.
Cómo convertir PX a PT en CSS
La conversión dentro de CSS requiere cuatro pasos.
- Identifique el valor de píxel desde el que está trabajando
- Multiplica ese valor por 0.75
- Escribe el resultado como un valor pt en la propiedad que lo necesita, como tamaño de fuente
- Obtenga una vista previa de la página y confirme que el tamaño renderizado coincida con lo que esperaba.
Un encabezado de 20 píxeles se convierte en font-size: 15pt; una vez convertido.
La mayoría de los equipos solo hacen esto cuando escriben una hoja de estilo de impresión dedicada, ya que pt dentro de una hoja de estilo de pantalla normal no se comporta como lo hace px.
Envolver las reglas basadas en pt dentro de una media query (EN) específica de impresión evita que afecten el aspecto de la página en una pantalla normal.
Saltarse ese paso significa que los visitantes que navegan normalmente podrían ver fuentes del tamaño de papel, no monitores.
Cómo convertir PX a PT en software de diseño e impresión
Convirtiendo en Adobe Illustrator e InDesign
- Abre Preferencias y establezca la regla o unidad tipográfica en puntos
- Ingresa la medida basada en píxeles multiplicada por 0.75 directamente en el campo de tamaño
- Confirma el valor en el panel Carácter o Párrafo, los cuales muestran el tamaño de letra en puntos de forma predeterminada.
Ambas aplicaciones mantienen las medidas tipográficas en puntos independientemente de las unidades de regla configuradas, ya que los puntos son la unidad de tipografía nativa en las herramientas de impresión de Adobe.
Convirtiendo en Microsoft Word
- Campo de tamaño de fuente: ya está medido en puntos, por lo que un valor pt convertido va directamente al cuadro de tamaño
- Espaciado y márgenes: Word tiene como valor predeterminado pulgadas para el diseño de página, lo que necesita una conversión por separado si se trata de valores de píxeles.
No hay entrada directa px en ninguna parte de la interfaz de Word, por lo que cada especificación basada en píxeles debe convertirse antes de que sea utilizable.
Conversión de un archivo de diseño de pantalla para imprimir
Exportar una maqueta de pantalla a algo imprimible significa cambiar algo más que el tamaño de fuente.
Por lo general, todo el archivo debe llevarse a una resolución de pantalla (EN) equivalente mucho mayor antes de que las medidas en píxeles sean útiles en papel.
Tres cosas cambian a la vez durante esa exportación:
- Los tamaños de fuente se convierten de px a pt usando la proporción de 0.75
- La resolución de la imagen cambia desde la densidad de la pantalla hasta 300 DPI
- Los espacios y los márgenes a menudo se reconstruyen en pulgadas o milímetros en lugar de escalarse directamente
Saltarse cualquiera de esos tres pasos es la razón más común por la que un diseño perfecto en pantalla sale mal de la impresora.
Cuando no se aplica la conversión de PX a PT
La relación 0.75 solo se mantiene exactamente en 96 DPI.
Salga de esa condición específica y la fórmula estándar px a pt dejará de dar una respuesta físicamente precisa.
Donde se descompone la fórmula estándar:
- Cualquier pantalla o documento configurado en DPI distinto de 96, ya que la proporción se fijó en esa línea de base
- Pantallas móviles y Retina de alta densidad, donde un CSS píxel se asigna a dos, tres o más píxeles del dispositivo físico
- Archivos convertidos para una salida de impresión de 300 DPI sin volver a calcular la proporción para esa resolución
- Documentos que utilizan puntos Didot en lugar de puntos estándar, ya que los dos sistemas de puntos no tienen el mismo tamaño físico
La propia definición de píxeles de referencia (EN) del W3C reconoce la brecha directamente: un CSS píxel mide aproximadamente 0,26 mm a una distancia de lectura normal. Esa cifra supone una configuración de visualización específica en lugar de un punto de pantalla medido real.
Es una aproximación deliberada, no una garantía física, que es exactamente la razón por la que el mismo número de píxeles parece de diferentes tamaños físicos en diferentes pantallas.
Algunos errores aparecen constantemente debido a esto:
- Aplicar la proporción de 0.75 a un archivo de impresión que en realidad está configurado en 300 DPI, generando un texto mucho más pequeño de lo previsto
- Tratar una pica y un punto como intercambiables, cuando una pica en realidad son doce puntos
- Suponiendo que un valor pt convertido se verá idéntico en todos los navegadores o motores de renderizado de todos los sistemas operativos.
Cuando se aplica cualquiera de estas condiciones, la solución no es una fórmula diferente. Se trata de cambiar a cualquier unidad en la que realmente mida el software de destino, ya sea configuración de impresión compatible con DPI o campos de puntos nativos del software.
Las unidades estáticas como px y pt también complican las cosas para los lectores que cambian el tamaño del texto en su navegador. Esta es una razón más por la que la guía sobre tipografía accesible (EN) se aleja por completo de las unidades fijas para el cuerpo del texto en pantalla.
Preguntas frecuentes: Conversor de PX a PT
¿Qué es una Pica y cómo se relaciona con los puntos?
Una pica es una unidad tipográfica igual a doce puntos, que se utiliza principalmente para medir el ancho de las columnas y la longitud de las líneas en el diseño de impresión.
Los puntos miden el tamaño de la letra, las picas miden bloques de espacio más grandes. Adobe La regla de InDesign se muestra como notación p y pt.
¿El zoom del navegador o la densidad de la pantalla afectan la conversión?
El zoom del navegador escala toda la página, incluidos los píxeles, por lo que la proporción de 0.75 se mantiene en cualquier nivel de zoom.
Densidad de pantalla funciona de manera diferente: las pantallas de alta densidad incluyen más puntos físicos en cada CSS píxel, distorsionando la apariencia de un tamaño de punto convertido sin cambiar las matemáticas.
¿Se puede volver a convertir PT a PX usando la misma fórmula a la inversa?
Sí. Divide el valor en puntos por 0.75 o multiplícalo por 1.333 para recuperar los píxeles. 12 puntos se convierte en 16 píxeles, 18 puntos se convierte en 24 píxeles. Los ejemplos resueltos se encuentran en la sección PT a PX anterior.
¿Cuál es la diferencia entre un punto estándar y un punto Didot?
Una punta estándar, utilizada en CSS y la mayoría del software, equivale a 1/72 de pulgada, o aproximadamente 0,353 mm.
Una punta Didot, común en la tipografía de Europa continental, mide aproximadamente 0,376 mm, basándose en la antigua pulgada real francesa en lugar de en la pulgada moderna.
¿Las unidades relativas como REM y EM necesitan conversión a PT?
No. Rem (EN) y em escalan en relación con el tamaño de fuente, mientras que pt es una unidad física fija sin relación con un elemento principal o raíz.
En primer lugar, la conversión entre ellos anula el propósito de utilizar una unidad relativa.
¿Cómo se confirma el resultado del convertidor PX a PT antes de usarlo?
El resultado de un convertidor de PX a PT se confirma verificando tres cosas en orden: la DPI suposición detrás del número, la unidad que espera el software de destino y cómo se representa realmente el valor una vez colocado.
Saltarse el pedido cuesta más tiempo que seguirlo. Una suposición errónea DPI solo surge en la tercera verificación, después de que el esfuerzo ya se ha realizado en las dos primeras.
- Confirma el DPI para el que está creado el archivo
- Haz coincidir la unidad con el software de destino
- Renderice o imprima una muestra de prueba antes de finalizar
Seguir esta secuencia agrega un paso manual a cada transferencia entre un equipo de pantalla y un equipo de impresión. A cambio, el documento nunca será necesario cambiar su tamaño después de la entrega.
Una vez que se comprueban los tamaños de fuente, el siguiente lugar donde se esconde la inconsistencia es el espaciado y el ancho del diseño. Ahí es donde comparar px con rem (EN) se convierte en la pregunta de conversión más útil.