Pixels to Inches Calculator

Understanding the Pixels to Inches Calculator

A pixel to inch converter divides a pixel count by a DPI figure. The DPI value is the whole calculation, and the default of 96 exists for a specific historical reason that no longer describes any real display.

How it actually works

Enter a pixel count and a DPI value. The calculator divides pixels by DPI for inches, then converts to centimetres and millimetres. Twelve hundred pixels at 300 DPI gives 4 inches, 10.16 centimetres, or 101.6 millimetres.

The deeper context most people miss

Ninety-six became the web standard because early Windows systems assumed it, and CSS formalised a reference pixel around that figure so that a CSS inch is a fixed 96 CSS pixels regardless of the actual display. It is a unit of convention rather than a measurement of any screen.

Why a CSS inch is not an inch

CSS defines physical units including inches, centimetres, and points, and on screen media they are anchored to the reference pixel rather than to physical measurement. One CSS inch is defined as exactly 96 CSS pixels, which means specifying an element as one inch wide produces something one inch wide only if the display happens to render CSS pixels at 96 per physical inch, which few do. On a high-density phone screen a CSS inch is physically much smaller than an inch, and on a large television viewed from a distance it may be larger. This is deliberate: the reference pixel was defined in terms of the angle subtended at a typical viewing distance rather than physical size, so that content scales sensibly across devices held at different distances, and it is why a 16 pixel font is comparably legible on a phone and a monitor despite very different physical sizes. Device pixel ratio expresses the relationship between CSS pixels and physical device pixels, with a ratio of 2 or 3 being common on modern phones, and it is why images need to be supplied at higher pixel dimensions than their CSS size to look sharp. The practical consequence is that physical units in CSS are unreliable for anything that must be a real size on screen, and are meaningful only in print stylesheets where the output has an actual physical dimension. For anything that must be physically accurate on screen, no reliable method exists without knowing the display's actual density.

A worked example: print against screen

Twelve hundred pixels at 300 DPI gives 4 inches, which is a meaningful statement for print because a printed page has real dimensions. The same 1200 pixels displayed on screen has no inherent size at all: it occupies 1200 physical pixels, which is roughly 12.5 inches on a 96 PPI monitor, about 6 inches on a 200 PPI laptop, and around 2.5 inches on a 460 PPI phone. This is why asking for an image at a size in inches for web use is a category error, and why web specifications are given in pixels. For print, the calculation runs the other way: decide the physical size and multiply by the target resolution to get the pixels required, so a 4 by 6 inch print at 300 DPI needs 1200 by 1800 pixels. That target resolution should reflect viewing distance rather than defaulting to 300, since 300 approximates the limit of what the eye resolves at reading distance and large-format work viewed from further away needs far less. The other frequent confusion is that changing the DPI value stored in an image file changes nothing about the image: it is metadata expressing an intended print size, and altering it without resampling leaves every pixel exactly as it was. Resampling, which changes the actual pixel count, is a different operation, and upsampling cannot recover detail that was never captured.

Deciding what resolution a job needs

Working backwards from output is the reliable approach. For print, establish the finished size and the viewing distance, then choose a resolution: 300 DPI for anything held in the hand, 150 to 200 for wall-hung work, 100 to 150 for large posters, and far less for banners and billboards viewed from tens of metres. Multiply the physical dimensions by that figure to get the pixel dimensions needed, and check the image actually has them rather than assuming. For screen, specify in pixels and supply higher-density variants for devices with a device pixel ratio above 1, using responsive image techniques so browsers select appropriately. For anything that must appear at a specific physical size on screen, such as a ruler or a document preview, the honest answer is that it cannot be done reliably without calibration, and applications that need it typically ask the user to calibrate against a known object. For scanning, the source resolution depends on the intended output and any enlargement, so scanning a small original for a large print needs a high source resolution, which is why film scanners specify figures in the thousands. For documents and text, 300 DPI is a common standard and OCR generally performs better at that or above.

DPI, PPI, and printer resolution

The terms are used interchangeably and describe different things. PPI, pixels per inch, describes an image: how many image pixels map to each inch of output. DPI, dots per inch, properly describes a printer: how many ink dots it places per inch. Printer DPI figures are much higher than image PPI for a specific reason. Most printers cannot vary the intensity of a single dot, so they simulate continuous tone through halftoning, placing patterns of dots whose density creates the appearance of lighter and darker areas, and producing a range of tones requires many printer dots per image pixel. This is why an inkjet advertising 4800 DPI does not imply images need 4800 PPI. In commercial offset printing the relevant figure is line screen, or LPI, and the conventional relationship is that image resolution should be roughly one and a half to two times the line screen, which is where the 300 PPI standard originates given a common 150 LPI magazine screen. Scanner resolution specifications distinguish optical resolution, which is what the sensor actually captures, from interpolated resolution, which is upsampled and adds no detail, and comparing on interpolated figures is misleading. For displays, PPI describes physical pixel density, and the same distinction between that and CSS pixels applies as above.

Variations: units, vector formats, and calibration

Points and picas are typographic units, with 72 points to an inch and 12 points to a pica, and the 72 figure is the source of the legacy Mac 72 DPI convention since it made one point equal one screen pixel. Millimetres are standard in most print specification outside the US. Vector formats including SVG, EPS, and PDF store shapes rather than pixels and scale to any size without resolution loss, which makes them the correct choice for logos, diagrams, and type, and sidesteps the entire pixel-to-inch question. Device-independent pixels appear in mobile development with platform-specific names and behave like CSS pixels. For genuine physical accuracy on screen, calibration against a known reference is the only reliable approach, and some applications include a calibration step asking users to match an on-screen ruler to a physical one or to a credit card, which has standard dimensions. Screen rulers and measurement tools rely on this. For print production, working in physical dimensions with an appropriate resolution set at the outset avoids conversion problems entirely, which is why print workflows specify size and resolution together rather than pixel counts alone.

Converting between pixels and physical size

Work backwards from output rather than converting an existing pixel count, deciding the finished physical size and the appropriate resolution, then multiplying to find the pixels needed. Choose resolution by viewing distance rather than defaulting to 300, using 300 for prints held in the hand, 150 to 200 for wall-hung work, and considerably less for large-format viewed from a distance. Understand that pixels have no inherent physical size on screen, so specifying web images in inches is meaningless and pixel dimensions are the correct specification. Remember that a CSS inch is defined as 96 CSS pixels rather than a physical measurement, so physical units in CSS are unreliable for anything that must be a real size on screen. Supply higher pixel dimensions for high-density displays, since device pixel ratios of 2 or 3 are common and standard-sized images look soft. Don't change DPI metadata expecting to improve an image, since it only states an intended print size and touches no pixel data. And use vector formats for logos and diagrams, which scale without any of this.

What people get wrong

• Specifying web images in inches, when pixels have no inherent physical size on screen and the same image spans very different physical dimensions across devices.
• Treating a CSS inch as a physical inch, when it is defined as exactly 96 CSS pixels and renders at very different physical sizes depending on display density.
• Changing an image's DPI metadata to improve quality, when it states an intended print size and alters no pixel data at all.
• Comparing scanners on interpolated resolution, which is upsampled and adds no real detail, rather than on optical resolution which is what the sensor captures.

Where the math comes from

Inches = Pixels / DPI. Centimetres = Inches × 2.54 and millimetres = centimetres × 10. The DPI value determines the entire result, and its meaning depends on context: 300 is a common print target, 96 is the CSS reference used for screen media, and actual physical display density varies by device and is what determines real on-screen size.

Questions and answers

Related calculators

Aspect Ratio · Screen Time · GSM Paper Weight · DPI Image · Paper Size