Pixels, Resolution and DPI Explained

Pixels are the building blocks

A digital image is a rectangular grid of pixels. Its dimensions are given as width by height, for example 4032 by 3024 pixels. Each pixel holds a color. The total number of pixels is the width multiplied by the height: 4032 × 3024 is about 12.2 million pixels, or 12.2 megapixels. More pixels mean the picture can hold more detail and can be shown larger without looking blocky.

The pixel count also drives the file size. An uncompressed picture needs a few bytes for every pixel, and even compressed files grow with the number of pixels. Cutting the pixel count is therefore the quickest way to shrink a file.

What resolution means

The word resolution is used in two ways. On a screen, it means the number of pixels, as in a screen resolution of 1920 by 1080. For an image, people often mean the same thing: a high-resolution photo is one with many pixels. When the word is used for printing, it also involves the size on paper, which is where DPI comes in.

A higher resolution in this sense is not automatically better. A picture only benefits from more pixels when it is shown or printed large enough to use them. On a phone screen, a photo of 12 megapixels is displayed at a fraction of its detail.

What DPI is

DPI stands for dots per inch. It describes how many pixels or printed dots fit into one inch of paper. A picture of 1800 by 1200 pixels printed at 300 DPI measures 6 by 4 inches, because 1800 divided by 300 is 6 and 1200 divided by 300 is 4. The same file printed at 150 DPI would measure 12 by 8 inches, but it would look coarser.

A rule of thumb is that 300 DPI gives sharp prints at normal reading distance, while large posters that are viewed from far away can be printed at lower values. These numbers are guidelines, and the right value depends on the printer and the viewing distance.

DPI does not change the file

Many people believe that saving a picture at 72 DPI makes it smaller than at 300 DPI. It does not. DPI is just a number stored in the file's metadata, and the pixels stay exactly the same. A 4000-pixel-wide photo has the same pixels, and nearly the same file size, whether it is labeled 72 or 300 DPI. Only the suggested print size changes.

For the web, DPI is irrelevant. Browsers show an image according to its pixel dimensions and the CSS size, not its DPI label. If a website or form asks for a certain DPI, it usually means the pixel dimensions that this would give at a stated print size, and you should work out the pixels you need from that.

How many pixels do you need?

Work backwards from the use. For a screen, take the size at which the image will be shown, in CSS pixels, and multiply by 1.5 to 2 for sharp display on dense screens. A column that is 700 pixels wide needs an image of 1000 to 1400 pixels. For print, multiply the print size in inches by the DPI: a 5 by 7 inch print at 300 DPI needs 1500 by 2100 pixels.

Anything beyond that is wasted data for the intended use. Sending a 12-megapixel photo to a form that shows a thumbnail does not make the thumbnail better; it only makes the upload slower.

Upscaling does not add detail

Making an image bigger in pixels does not add real detail. The software has to invent new pixels by averaging the neighbors, and the result is softer, not sharper. Some tools use machine learning to produce plausible detail, but that is a guess, not a recovery of the original.

That is why you should resize down, not up, and why you should keep originals at their full size. This compressor never enlarges an image: if you pick a maximum size that is larger than the picture, the picture keeps its own size.

Practical advice

Know the output first: for web and email, decide the display width and resize to it; for print, calculate the needed pixels from the paper size and the DPI. Check the dimensions of a picture in your device's file information before you compress. And remember that compression quality and resolution are separate settings that work together.

With the compressor you can see the original and new dimensions in the list whenever a picture is scaled, which helps you confirm that the result matches the pixel size that you need.

Why DPI labels cause confusion

Image editors show a DPI field in the resize dialog, and many people change it hoping to reduce a file. It only changes how big the image would be on paper. The confusion is old: in the early days of computing, screens were commonly described as 72 or 96 dots per inch, and the numbers stuck, although modern screens have very different densities.

If you work for print, check with your print shop what they need, usually expressed as pixel dimensions at a size, or as DPI at the printed size. For anything that stays on a screen, forget the number and think in pixels.