Resize to exact pixel dimensions, compress with a quality slider and convert between JPG, PNG and WebP, without uploading anything.
A typical smartphone photo is 3–8 MB and around 4000 × 3000 pixels. Most uses need a fraction of that. Here’s how to shrink images dramatically while keeping them looking sharp.
1. Resize to the size you actually need
This is the biggest win. File size scales roughly with pixel count, which is width × height.
| Dimensions | Pixels | Relative size |
|---|---|---|
| 4000 × 3000 | 12.0 MP | 100% |
| 2000 × 1500 | 3.0 MP | 25% |
| 1200 × 900 | 1.1 MP | 9% |
Halving width and height cuts pixels by 75%. If an image displays at 800 px wide on your site, there’s little reason to upload one 4000 px wide, though about 2× (1600 px) helps on high-density screens.
Use the image resizer, keep the aspect ratio locked and enter your target width. For common targets, see Best Image Sizes for Websites and Social Media (2026 Cheat Sheet).
2. Compress with the right quality setting
For lossy formats (JPG, WebP), quality controls how aggressively detail is discarded:
| Quality | Typical result |
|---|---|
| 90–100% | Near-identical, large files |
| 75–85% | Sweet spot: visually identical for most photos, much smaller |
| 60–70% | Fine for thumbnails; artefacts may appear on close inspection |
| Below 50% | Visible blockiness and colour banding |
Compare the before and after sizes the resizer shows, and zoom in on edges and skin tones to check quality.
3. Choose a more efficient format
- Photo saved as PNG? Convert to JPG or WebP. Often 70–90% smaller.
- JPG on a website? WebP is typically 25–35% smaller at the same quality.
- Logo as PNG? An SVG may be a fraction of the size and infinitely sharp.
Details in JPG vs PNG vs WebP: Which Image Format Should You Use?.
4. Strip metadata
Photos carry EXIF metadata: camera model, settings, date and often GPS location. It can add tens of kilobytes and is a privacy risk. Re-encoding through the canvas, as our resizer does, removes it automatically.
5. Serve responsive images on websites
Let the browser pick the right size for each screen:
<img
src="photo-1200.webp"
srcset="photo-600.webp 600w, photo-1200.webp 1200w, photo-1800.webp 1800w"
sizes="(max-width: 700px) 100vw, 700px"
width="1200" height="800" alt="…" loading="lazy">Always include width and height to prevent layout shift (CLS), and use loading="lazy" for images below the fold. Don’t lazy-load your main hero image, though; that delays LCP.
6. Crop out what you don’t need
Cropping empty sky or background removes pixels and focuses attention on the subject. Crop first, then resize.
Target file sizes
| Use | Aim for |
|---|---|
| Website hero image | 100–300 KB |
| Blog / content image | 50–150 KB |
| Thumbnail | under 30 KB |
| Email image | under 200 KB each |
| Form uploads (ID, documents) | check the limit, often 200 KB – 2 MB |
| Social media | platform recompresses; upload high quality at the right dimensions |
Hitting a strict limit (e.g. “under 100 KB”)
- Resize to the smallest acceptable dimensions.
- Choose JPG.
- Start at quality 80% and lower in steps of 5 until the file fits.
- If it still doesn’t fit, reduce dimensions by another 10–20%.
Everything happens in your browser. Your images are never uploaded.
Resize to exact pixel dimensions, compress with a quality slider and convert between JPG, PNG and WebP, without uploading anything.