How to resize an image (free, in your browser)
Resizing is 90% picking the right target size and 10% math. This page gives you the exact pixel dimensions people actually need, then explains what the resizer is doing under the hood.
Resize an image in four steps
- Open Resize image — it runs in your browser, so the file never leaves your device.
- Drop in a JPG, PNG, WebP or AVIF file (or several at once).
- Enter a width in pixels or a percentage, and leave the aspect-ratio lock on.
- Check the before/after preview and file size, then download.
Common target sizes
| Use case | Size | Why |
|---|---|---|
| Website hero / full-width banner | 1920 × 1080 px | Covers retina laptops without wasting bytes. |
| Blog / article inline image | 1200 × 800 px | Sharp at 2× on a 600 px content column. |
| Thumbnail / avatar | 400 × 400 px | Let CSS scale down; never upscale a small crop. |
| Instagram post (square) | 1080 × 1080 px | Instagram re-compresses anything larger. |
| Instagram / TikTok story | 1080 × 1920 px | 9:16 vertical. |
| YouTube thumbnail | 1280 × 720 px | Must stay under 2 MB. |
| LinkedIn / X shared link image | 1200 × 630 px | Same size works for Open Graph previews. |
| Email attachment / signature | 800 px wide | Keeps the message under most 20–25 MB limits. |
| 4×6 in photo print at 300 DPI | 1800 × 1200 px | Print pixels = inches × DPI. |
| A4 print at 300 DPI | 2480 × 3508 px | A4 is 8.27 × 11.69 in. |
Pixels, percent and DPI
- Pixels are what screens care about. A 1200 px-wide image looks sharp in a 600 px column on a retina display.
- Percent is handy for batches of mixed sizes — 50% halves every image without you doing arithmetic.
- DPI only matters for print. Pixels needed = inches × DPI. A 4×6 in print at 300 DPI needs 1800 × 1200 px; changing the DPI tag alone adds no detail.
- Never upscale. Enlarging a 400 px image to 2000 px invents no new detail — it just adds bytes and softness.
Resampling, and why edges get soft
Shrinking an image means several source pixels must become one. Nearest-neighbour picks a single pixel and looks jagged; bilinear averages four; bicubic / Lanczos weighs a wider neighbourhood and keeps edges crisp. Toolsii uses high-quality resampling by default, so you rarely need to sharpen afterwards. If a downscaled screenshot with fine text still looks fuzzy, resize to an exact integer fraction (50%, 25%) instead of an arbitrary value.
Resize or compress?
They solve different problems. Resizing changes dimensions; compression changes how many bytes those pixels cost. For a photo that is both huge and heavy, resize first, then compress — in that order you throw away the pixels nobody sees before spending quality on the ones that remain.
- JPG — photos, universal support.
- PNG — screenshots, logos, transparency.
- WebP — roughly 30% smaller than JPG, supported by every current browser.
- AVIF — roughly 50% smaller, slower to encode, best for hero images.
FAQ
Does resizing reduce quality?
Downscaling discards pixels, so fine detail is lost, but at sensible sizes the result looks identical on screen. Upscaling always looks worse.
Are my photos uploaded to a server?
No. Toolsii resizes with WebAssembly inside your browser tab; nothing is transmitted or stored.
Can I resize many images at once?
Yes — drop in multiple files and apply the same width or percentage to all of them.
How do I hit an exact file size, like under 1 MB?
Resize to your target dimensions first, then use Compress image and lower the quality slider until the reported size fits.
Tools: Resize image · Compress image · Crop image · Convert image
Related reading: WebP vs AVIF · HEIC to JPG