By ToolzHive · Updated
Choose image dimensions for the destination. Pixels, file size and print resolution describe different things.
Reference table
| Concept | Calculation or example | Check |
|---|---|---|
| Aspect ratio | width ÷ height | 1200 × 800 is 3:2 |
| Proportional scaling | new height = old height × new width ÷ old width | 2400 × 1600 becomes 1200 × 800 |
| High-density display | 600 CSS px × 2 = 1200 image px | Serve an appropriate responsive source |
| Print width | pixel width ÷ pixels per inch | 1800 px at 300 ppi prints 6 inches wide |
| Crop to fit | Remove edges to change aspect ratio | Keep important content inside the crop |
| File size | Depends on format, detail and encoding | Dimensions do not guarantee a KB limit |
Worked example
For a 600 by 400 CSS-pixel box, a 1200 by 800 source can suit a 2× display. Supply smaller responsive alternatives so every visitor need not download the largest version.
Upscaling
Adding pixels cannot restore missing detail. Keep the original and inspect text and sharp edges after resizing.
Try the related tools
- Image Resizer — Resize images to exact pixel dimensions or by percentage.
- Image Compressor — Reduce image file size while keeping visual quality.
- Image Cropper — Crop images freely or to popular aspect ratios like 1:1 and 16:9.