Convertidor de Puntos a Píxeles
Transforma pt a px al instante con precisión profesional
(Pantalla estándar)
(Web/Mac)
(Pantalla HD)
(Impresión)
¿Qué son los Puntos y Píxeles?
Los puntos (pt) y los píxeles (px) son unidades de medida fundamentales en diseño digital y tipografía. Los puntos tienen su origen en la imprenta tradicional, donde 1 pulgada equivale a 72 puntos. Los píxeles representan el elemento más pequeño de una imagen digital en pantalla.
En diseño web moderno, la conversión entre estas unidades depende de la resolución DPI (puntos por pulgada) o PPI (píxeles por pulgada) del dispositivo. La mayoría de las pantallas usan 96 DPI como estándar, mientras que las pantallas Retina y dispositivos de alta resolución pueden llegar a 300 DPI o más.
Tabla de Conversión pt a px
| Puntos (pt) | Píxeles @ 96 DPI | Píxeles @ 72 DPI | Uso Común |
|---|---|---|---|
| 6 pt | 8 px | 6 px | Texto legal, notas pequeñas |
| 8 pt | 11 px | 8 px | Pie de página, disclaimers |
| 10 pt | 13 px | 10 px | Texto secundario |
| 12 pt | 16 px | 12 px | Texto base (estándar) |
| 14 pt | 19 px | 14 px | Subtítulos, párrafos destacados |
| 16 pt | 21 px | 16 px | Encabezados pequeños (h4) |
| 18 pt | 24 px | 18 px | Encabezados medianos (h3) |
| 24 pt | 32 px | 24 px | Encabezados principales (h2) |
| 36 pt | 48 px | 36 px | Títulos grandes (h1) |
| 48 pt | 64 px | 48 px | Hero text, banners |
| 72 pt | 96 px | 72 px | Texto display, posters |
Fórmulas y Métodos de Conversión
De Puntos a Píxeles
píxeles = puntos × (DPI / 72)
Para pantallas estándar de 96 DPI:
píxeles = puntos × 1.333
De Píxeles a Puntos
puntos = píxeles × (72 / DPI)
Para pantallas estándar de 96 DPI:
puntos = píxeles × 0.75
Pasos para Convertir Manualmente
- Paso 1: Identifica la resolución DPI de tu dispositivo o proyecto (generalmente 96 DPI para web)
- Paso 2: Toma el valor en puntos que deseas convertir
- Paso 3: Multiplica los puntos por (DPI / 72). Por ejemplo: 12 pt × (96/72) = 16 px
- Paso 4: Redondea el resultado si es necesario para obtener valores enteros
🖥️ Puntos (pt)
Origen: Tipografía tradicional
Uso ideal: Impresión, documentos PDF
Ventaja: Consistencia en medios físicos
Estándar: 72 pt = 1 pulgada
📱 Píxeles (px)
Origen: Pantallas digitales
Uso ideal: Diseño web, apps móviles
Ventaja: Control pixel-perfect en pantalla
Variable: Depende de densidad de pantalla
FAQs
¿Cuántos píxeles son 12 puntos?
A 96 DPI (estándar web), 12 pt equivalen a 16 px. Esta es la conversión más común ya que 12 pt es el tamaño de texto base en muchos documentos y navegadores usan 16px como tamaño predeterminado.
¿Por qué la conversión cambia según el DPI?
El DPI (dots per inch) determina cuántos puntos o píxeles caben en una pulgada. En pantallas de 72 DPI, 1 pt = 1 px. Pero en pantallas de 96 DPI (Windows estándar), 1 pt = 1.333 px. Pantallas Retina pueden tener 200+ DPI, cambiando aún más la relación.
¿Debo usar pt o px en CSS?
Para diseño web, usa píxeles (px), rem o em. Los puntos (pt) son mejores para hojas de estilo de impresión (@media print). Los píxeles te dan control preciso en pantalla, mientras que pt está optimizado para documentos físicos.
¿Cómo afecta esto al diseño responsive?
En diseño responsive moderno, se prefieren unidades relativas (rem, em, %) sobre pt y px fijos. Sin embargo, entender la conversión pt-px es crucial cuando trabajas con diseños de Photoshop/Illustrator que usan puntos y necesitas implementarlos en web con píxeles.
¿Qué DPI usar para proyectos de impresión?
Para impresión profesional, usa 300 DPI. Para impresión básica, 150-200 DPI es suficiente. Para pantallas, 72-96 DPI es el estándar. Esto significa que un texto de 12 pt en impresión (300 DPI) se verá mucho más grande en píxeles: 50 px versus 16 px en pantalla.
¿Figma usa puntos o píxeles?
Figma usa píxeles (px) para posicionamiento y dimensiones, pero puntos (pt) para tamaños de fuente. Esto puede causar confusión al exportar diseños. Al pasar a código CSS, normalmente convertirás los pt de Figma a px usando la relación 96 DPI.