Conversor de píxeles

¿Qué es el conversor de píxeles?

El conversor de píxeles traduce entre píxeles digitales y unidades de longitud reales (milímetros, centímetros, pulgadas) con cualquier DPI que elijas. Los píxeles CSS asumen 96 DPI por defecto, pero el trabajo de imprenta usa 300 DPI y la impresión fotográfica puede llegar a 600 DPI — con DPI distintos, el mismo número de píxeles se traduce a tamaños físicos muy diferentes. Escribe un valor en cualquiera de las cuatro unidades, elige el ajuste de DPI que coincida con tu contexto y las otras tres unidades se actualizan en tiempo real. Cada resultado está a un clic del portapapeles.

Cómo usar el conversor de píxeles

1. Escribe el valor que quieres convertir en el campo de entrada — por ejemplo, 100.
2. Elige la unidad en la que está tu valor: píxeles, milímetros, centímetros o pulgadas.
3. Selecciona un ajuste de DPI — 96 DPI para web, 300 DPI para imprenta, o elige «Personalizado» para introducir tu propio DPI.
4. Lee los valores convertidos para las otras tres unidades en el panel de resultados de abajo.
5. Pulsa Copiar junto a cualquier resultado para enviarlo al portapapeles, o comparte la URL — tu entrada se conserva como parámetro de consulta.

Quién usa un conversor de píxeles

• Estudiantes: Tareas de matemáticas y física que implican conversiones de píxeles a milímetros, además de ejercicios sobre resolución de pantalla en cursos de gráficos por computadora.
• Diseñadores web y de UI: Dimensionar iconos, espaciados y componentes a partir de medidas físicas de mockups (mm) en píxeles CSS con el DPI de referencia correcto.
• Diseñadores de imprenta: Convertir exportaciones en píxeles de Photoshop o Figma a milímetros y pulgadas a 300 DPI antes de enviarlas a la imprenta.
• Fotógrafos: Calcular las dimensiones físicas de impresión a partir de la salida de la cámara (p. ej. 4000 × 3000 px a 300 DPI imprime a 13,3 × 10 pulgadas).
• Desarrolladores: Validar valores de píxeles CSS frente a los tamaños físicos especificados en requisitos de producto o de accesibilidad.

Por qué este conversor

• Las cuatro unidades (píxeles, milímetros, centímetros, pulgadas) se actualizan en tiempo real mientras escribes.
• Cinco ajustes de DPI predefinidos cubren los casos habituales — 96 DPI web, 72 DPI Mac legacy, 150/300/600 DPI para imprenta.
• Entrada de DPI personalizada para pantallas no estándar (Retina, monitores de alta densidad) y flujos de trabajo de imprenta especializados.
• URL compartible — tu valor, unidad de origen y DPI se conservan como parámetros de consulta.
• 100 % en el navegador: sin registro, sin anuncios en el panel de resultados y la matemática es de código abierto.

¿Hasta qué punto es preciso el conversor?

El conversor utiliza la relación estándar de 25,4 milímetros por pulgada y el DPI que indiques, calculados con precisión doble IEEE 754. Los resultados son exactos dentro del redondeo de coma flotante (error relativo ≤1×10⁻⁶). La única fuente de imprecisión real es el propio valor de DPI — si tu pantalla no funciona realmente al DPI asumido, calíbrala primero con la herramienta Screen Ruler.

Preguntas frecuentes

¿Qué es un píxel?

Un píxel es la unidad discreta más pequeña de una pantalla o imagen digital. Su tamaño físico no es fijo — depende de la densidad de píxeles (DPI) de la pantalla. En una pantalla web a 96 DPI, un píxel mide exactamente 1/96 de pulgada (unos 0,265 mm); en una impresión a 300 DPI, un píxel mide 1/300 de pulgada (unos 0,085 mm).

¿Qué es el DPI y por qué importa?

El DPI (puntos por pulgada) es el factor de conversión entre píxeles y longitud física. Los mismos 100 px equivalen a 26,46 mm a 96 DPI pero solo a 8,47 mm a 300 DPI. Debes usar el DPI del medio destino — la pantalla, la impresión o la exportación — para que la conversión tenga sentido físico.

¿Cómo se convierten píxeles a milímetros?

Divide el número de píxeles entre el DPI para obtener pulgadas y luego multiplica por 25,4 para obtener milímetros: mm = (px / DPI) × 25,4. Para 100 px a 96 DPI: 100/96 × 25,4 ≈ 26,46 mm. El conversor lo hace por ti en tiempo real.

¿Debo usar 72 o 96 DPI para la web?

Usa 96 DPI. CSS, los navegadores y los sistemas operativos estandarizaron 96 píxeles de referencia por pulgada en los años 90. El valor de 72 DPI es un legado de la tipografía temprana de Apple (un píxel = un punto tipográfico) y solo sigue siendo útil para activos específicos de la era Mac — el trabajo web moderno asume 96.

¿Qué DPI debo usar para imprenta?

Usa 300 DPI para impresión de alta calidad de revistas y libros, 150 DPI para pruebas y trabajo de gran formato, y 600 DPI solo para impresiones fotográficas, line art fino o texto bajo gran ampliación. Pasar de 300 DPI en trabajo general aumenta el tamaño de archivo sin mejora visible en la mayoría de papeles.

¿Cómo afecta Retina/HiDPI a la conversión?

Las pantallas Retina y otras HiDPI renderizan dos o tres píxeles físicos por cada píxel CSS. El conversor trabaja en píxeles CSS por defecto, así que 100 px CSS a 96 DPI es correcto en cualquier pantalla HiDPI. Si necesitas el recuento de píxeles físicos, multiplica por la device pixel ratio (window.devicePixelRatio en un navegador).

¿Por qué mi diseño web se ve más pequeño en un monitor 4K?

La mayoría de sistemas operativos ejecutan los monitores 4K con escalado al 150–200 %, lo que mantiene los píxeles CSS visualmente parecidos a los de una pantalla 1080p. Si el escalado está desactivado, tu diseño se verá físicamente más pequeño porque el mismo número de píxeles cubre menos pulgadas reales. Ajusta el escalado de DPI en los ajustes del SO, o usa unidades rem o porcentajes en lugar de px fijos.

Profundización en DPI — elige el número correcto una vez

Cada conversión de píxel a longitud es una sola ecuación: longitud = píxeles ÷ DPI. La parte difícil es elegir el DPI que coincide con el medio donde vivirá tu salida. Un DPI incorrecto no da error — produce silenciosamente un número matemáticamente correcto y físicamente equivocado. Las preselecciones de abajo cubren el 95 % del trabajo real.

Trabajo web — siempre 96 DPI

CSS, los navegadores y los sistemas operativos se estandarizaron en 96 píxeles de referencia por pulgada a finales de los 90, y ese número no ha cambiado. Todo navegador moderno trata 1 píxel CSS como 1/96 de pulgada sin importar la pantalla física. Las pantallas Retina y 4K renderizan a mayor densidad física, pero el SO reescala los píxeles CSS de vuelta a la referencia de 96 DPI, así que tus cálculos siguen siendo válidos. Trata 72 DPI como herencia — solo importa si estás extrayendo recursos de Macs anteriores a OS X.

Trabajo de impresión — 150, 300 o 600 DPI

La mayoría de revistas, libros e impresiones fotográficas usan 300 DPI. Baja a 150 DPI para pruebas borrador y trabajo de gran formato donde la distancia de visión oculta la pérdida de resolución; eso reduce el tamaño del archivo a la mitad y aún se lee nítido desde un metro. Sube a 600 DPI solo cuando la impresión se inspeccionará de cerca — line art fino, planos técnicos, texto pequeño en papel satinado. Pasar de 600 DPI casi nunca mejora la calidad visible y consume espacio en disco.

Retina y HiDPI — trabaja en píxeles CSS

Una pantalla Retina renderiza dos o tres píxeles físicos por cada píxel CSS, pero el SO oculta esto a tu código. Quédate con píxeles CSS (96 DPI) para la matemática de layout. Si necesitas el número real de píxeles físicos — por ejemplo al entregar recursos bitmap que deben verse nítidos en cada dispositivo — multiplica por window.devicePixelRatio en tiempo de ejecución y entrega variantes @2x o @3x. El conversor de píxeles trata la entrada como píxeles CSS por defecto; marca la casilla DPI personalizado solo cuando hayas medido genuinamente la densidad física de píxeles de una pantalla conocida.

Patrones de conversión comunes

Algunos valores de píxel aparecen tan a menudo que vale la pena memorizarlos. La tabla muestra a qué se traducen 100 px, 1000 px y un ancho típico Full HD (1920 px) en los cuatro valores DPI más comunes.

Consejos prácticos para desarrolladores

Verifica primero en DevTools

Antes de confiar en una conversión, confirma que el navegador reporta 96 DPI de referencia escribiendo window.matchMedia('(min-resolution: 96dpi)').matches en la consola. En un sistema bien configurado devuelve true. Si devuelve false, tu escala del SO o nivel de zoom no es el predeterminado y la conversión necesita ajuste.

Exporta siempre al DPI objetivo

Photoshop, Figma y la mayoría de herramientas de diseño exportan al DPI del lienzo por defecto. Configura el DPI del lienzo a tu medio objetivo antes de exportar — exportar un lienzo de 96 DPI a 300 DPI no muestrea la imagen al alza, solo reetiqueta los metadatos y se imprime a un tercio del tamaño físico previsto.

Calibra la pantalla para verdad de referencia

Si tu trabajo depende de la precisión física — medir un objeto de mano contra la pantalla, dimensionar un icono al ancho conocido de una tarjeta de crédito — abre primero Screen Ruler y calibra contra una tarjeta real. El DPI real de tu pantalla rara vez coincide con la hoja de especificaciones; la calibración fija la conversión a la realidad física.