Pixels to Inches Converter

DPI (dots per inch) and PPI (pixels per inch) get used interchangeably, but they describe different physical things. PPI is the correct term for a display or a digital image: the count of pixels packed into one inch of screen or one inch of canvas at the chosen output size. DPI is the correct term for a print device: the count of ink droplets the printer lays down per inch of paper. A 300 PPI image sent to a 1200 DPI printer is normal, because the printer uses multiple ink dots to render each pixel through halftone screening. The math in this converter is identical for both because both reduce to a count-per-inch ratio, but if you are talking to a designer about image resolution use PPI, and if you are talking to a print shop about output device capability use DPI.

The split is historical: Apple and Microsoft shipped different reference inches when their operating systems first added display scaling. Macintosh in 1984 used 72 PPI so one screen pixel matched one PostScript point (1/72 in), which made WYSIWYG between screen and printer trivially consistent. Windows shipped at 96 PPI a few years later, which made on-screen text roughly 33 percent larger at the same point size and was easier to read on the cheap CRT monitors of the era. CSS later adopted the 96 PPI reference inch as a web standard (CSS Working Group, 2011), which is why 96 DPI is the implicit baseline for everything you see in a browser today. Modern displays do not actually run at either 72 or 96 PPI (typical desktop monitors are 100 to 140 PPI, smartphones are 300 to 500 PPI), but the OS pretends they do and scales accordingly.

300 DPI is the threshold where the human eye stops resolving individual dots at typical reading distance (about 12 inches / 30 cm), so prints look continuous and photographic rather than pixelated. The figure traces back to halftone screen rulings used in offset printing, where a 150 lpi (lines per inch) halftone needs at least 2x oversampling to render cleanly, which lands at 300 ppi for the source image. Below 300 DPI you can start to see jagged edges on small type and fine line work; above 300 DPI you stop gaining visible quality unless you are printing for close inspection (museum reproduction, fine art, technical illustration), where 600 DPI is the next tier. Magazines, brochures, photo books, and most commercial print specify 300 DPI minimum for raster images.

A CSS pixel is a logical unit defined as 1/96 of a reference inch on a reference device, not a physical screen pixel. The CSS spec ties the inch to the visual angle a pixel subtends at a typical viewing distance, so the browser is free to scale the CSS pixel up or down to match the real device. On a Retina iPhone, 1 CSS pixel is actually 3 hardware pixels wide (3x device pixel ratio), and on a standard desktop monitor 1 CSS pixel is 1 hardware pixel. That is why a 16px font looks the right size on every device: the browser scales the CSS pixel to keep the perceived size constant. Use CSS pixels (px) for layout and font sizes; use physical inches or cm only when you are designing for print.

Because the operating system does not know the physical dimensions of your screen. A 1920 x 1080 image is the same pixel count whether you view it on a 24-inch desktop monitor (about 92 PPI), a 13-inch laptop (about 169 PPI), or a 4K TV (about 50 PPI), and the same image will measure roughly 21 inches wide, 11 inches wide, or 38 inches wide depending which screen renders it. CSS works around this by pretending every screen is 96 PPI and letting the OS scale to compensate (browser zoom, OS display scaling, mobile device pixel ratio), but the actual physical size on screen is never reliable unless you measure it with a ruler. For anything where the physical size must be exact (print proofs, signage layouts, packaging dielines), work in inches or millimeters and proof on paper. Treat any on-screen ruler as a rough guide only.