DPI vs Resolution: Image Settings for Print vs Web (2026 Guide)
DPI and resolution are two of the most confused concepts in image work. DPI (dots per inch) matters for printing. Resolution (pixel dimensions) matters for screens. Using the wrong setting leads to blurry prints or unnecessarily large files. This guide explains exactly how each works and which setting to use for every situation.
Quick Reference
150–300 DPI
300 DPI for sharp quality
300 DPI
Industry standard minimum
72–150 DPI
Viewed from a distance
Any DPI — only pixel dimensions matter
DPI is ignored by browsers
Any DPI
Platform re-compresses regardless
Serve at 2× pixel dimensions
Device handles DPI scaling
What Is DPI?
DPI stands for dots per inch — a measurement of how many ink dots a printer places in one inch of physical output. More dots per inch means finer detail and sharper edges in the printed result.
DPI is a print concept. It describes the relationship between a digital image's pixel data and a physical output size. A 3000 × 2400 pixel image printed at 300 DPI produces a 10 × 8 inch print. The same image at 150 DPI produces a 20 × 16 inch print — same pixels, just spread across more physical space.
The formula:
Print size (inches) = Pixel dimension ÷ DPI
Example: 3000 px ÷ 300 DPI = 10 inch print at full quality
What Is PPI?
PPI stands for pixels per inch — the same concept as DPI but used for screens instead of printers. A 72 PPI monitor displays 72 pixels per physical inch of screen. A 300 PPI Retina display shows 300 pixels per inch — which is why text and images appear sharper on high-resolution screens.
In everyday use, DPI and PPI are used interchangeably — people say "72 DPI for web" when they technically mean 72 PPI. The distinction matters in professional workflows but not in practical image optimization.
DPI for Web: Why It Doesn't Matter
This is the most important point in this guide: browsers ignore the DPI setting embedded in image files. What matters for web images is pixel dimensions only.
When you export an image at "72 DPI" for web versus "300 DPI" for print, you are not changing the number of pixels — you are only changing a metadata tag embedded in the file. A browser reads the pixel dimensions and ignores the DPI tag entirely.
Proof:
- 800 × 600 px image exported at 72 DPI → browser displays it at 800 × 600 px
- 800 × 600 px image exported at 300 DPI → browser displays it at 800 × 600 px (identical)
- The file exported at 300 DPI is slightly larger due to extra metadata — but looks identical
For web images, the only setting that affects display is pixel dimensions. The DPI embedded in the file has no effect on how the browser renders the image.
300 DPI for Print: What It Means
300 DPI is the standard resolution for professional print work — magazines, brochures, business cards, photo prints. At 300 DPI, individual ink dots are small enough that the human eye cannot distinguish them at normal viewing distance (25–30 cm / 10–12 inches).
The practical implication: to print at a given physical size at 300 DPI, you need a specific minimum pixel count.
| Print size | Pixels needed at 300 DPI | Megapixels |
|---|---|---|
| 4 × 6 in (10 × 15 cm) | 1200 × 1800 px | 2.2 MP |
| 5 × 7 in (13 × 18 cm) | 1500 × 2100 px | 3.2 MP |
| 8 × 10 in (20 × 25 cm) | 2400 × 3000 px | 7.2 MP |
| A4 (21 × 29.7 cm) | 2480 × 3508 px | 8.7 MP |
| A3 (29.7 × 42 cm) | 3508 × 4961 px | 17.4 MP |
| 11 × 14 in (28 × 36 cm) | 3300 × 4200 px | 13.9 MP |
Passport and ID Photo DPI Requirements
Passport photos have specific size requirements measured in millimeters. At 300 DPI (the digital equivalent for ID printing), the pixel calculation is:
Pixels = mm × (300 ÷ 25.4)
Example: 35mm wide → 35 × (300/25.4) = 413 pixels wide
| Country | Physical size | Pixels at 300 DPI |
|---|---|---|
| United States | 2 × 2 inch (51 × 51mm) | 600 × 600 px |
| United Kingdom / EU | 35 × 45mm | 413 × 531 px |
| Canada | 50 × 70mm | 591 × 827 px |
| Australia | 35 × 45mm | 413 × 531 px |
| China | 33 × 48mm | 390 × 567 px |
Generate the correct pixel size for your passport: Passport Photo Maker — free, browser-based, 10 country presets.
DPI for Large Format Print
For large format output — banners, posters, trade show displays — 300 DPI is neither required nor practical. These materials are viewed from a distance where individual dots are not distinguishable.
| Format | Viewing distance | Recommended DPI |
|---|---|---|
| Business card / brochure | 25–30 cm | 300 DPI |
| A0 poster (viewed up close) | 50–80 cm | 150 DPI |
| Trade show banner (2m+) | 1–2 m | 100–150 DPI |
| Billboard / outdoor sign | 5–50 m | 15–72 DPI |
| Vehicle wrap | 3–10 m | 50–100 DPI |
Retina Screens and Web Images
High-DPI (Retina, HiDPI) screens display at 2× or 3× pixel density. A standard screen at 1920 × 1080 CSS pixels would need a 3840 × 2160 pixel image to look sharp on a 2× Retina display.
The practical solution for web is to serve 2× resolution images using the srcset attribute:
<img src="image-400.jpg" srcset="image-400.jpg 1x, image-800.jpg 2x" alt="Description" width="400" height="300" />
On a standard screen, the browser downloads the 400px version. On a Retina screen, it downloads the 800px version — same visual display size, sharper rendering.
Related Tools
- Passport photo maker — correct pixel sizes at 300 DPI for 10 countries
- Compress image — reduce file size for web without affecting DPI
- Resize image — change pixel dimensions for print or web
- Image SEO guide — how image settings affect search rankings
Frequently Asked Questions
What is the difference between DPI and resolution?
DPI (dots per inch) is a print concept — it describes how many ink dots a printer places per inch of physical output. Resolution refers to the total pixel count of an image (e.g., 3000 × 2400 px). For printing, both are relevant. For web, only pixel dimensions matter — DPI is ignored by browsers.
Does DPI matter for web images?
No. Browsers ignore the DPI value embedded in image files. For web images, only the pixel dimensions affect display. A 800 × 600 px image at 72 DPI displays identically to the same image at 300 DPI — both appear at 800 × 600 pixels in the browser.
What DPI should I use for print?
300 DPI is the standard for professional print work — photos, magazines, brochures, business cards. For large-format materials viewed from a distance (banners, posters), 100–150 DPI is sufficient. For billboards, as low as 15–72 DPI is common.
What is 72 DPI in pixels?
72 DPI is a screen resolution standard — originally set by Apple in the 1980s. At 72 DPI, 1 CSS pixel = 1 physical pixel on an original standard monitor. On modern Retina displays at 144+ PPI, the OS scales the display so 1 CSS pixel is still rendered at the same apparent size.
How do I calculate pixels needed for a print at 300 DPI?
Multiply the desired print size in inches by 300. For a 4 × 6 inch print: 4 × 300 = 1200 px wide, 6 × 300 = 1800 px tall. For millimeters: px = mm × (300 / 25.4). For example, 35mm = 35 × 11.81 = 413 px.
Can I change the DPI of an image without losing quality?
You can change the DPI metadata embedded in a file without resampling the actual pixels. This does not change the image quality or pixel count — only the embedded print size hint. However, increasing DPI by adding new pixels (upsampling) does reduce quality because the software has to invent pixel data.