A photo straight off a phone is often around 4,000 pixels wide - roughly three times wider than the space it will ever occupy in a blog post, a slide, or a profile picture. Resizing changes the picture's actual pixel dimensions so it matches where it is going: 1200 pixels for a web page, 1080 for an Instagram post, 150 for a thumbnail. This guide covers what resizing changes, why locking the aspect ratio stops photos looking stretched, how resizing differs from cropping and compressing, and why enlarging never brings detail back - with a worked example you can follow in the Image Resizer.
What resizing actually changes
An image is a grid of pixels, and its dimensions are simply how many columns and rows that grid has. A typical 12-megapixel phone photo is 4032×3024 - just over 12.1 million pixels. Resizing rebuilds that grid at a new size. Going smaller, groups of neighboring pixels are averaged into single new ones, which is why a downscaled photo still looks sharp; the resizer uses high-quality smoothing so edges stay clean rather than jagged. Nothing else about the picture changes - same framing, same subject, same colors - there are simply fewer pixels describing it, and file size falls roughly in step with the pixel count. That makes resizing the biggest single saving available on an oversized image.
Resizing, cropping and compressing are three different things
All three end up with a smaller file, so they get muddled constantly, but they change different things:
- Resizing changes the width and height. The whole picture is kept, just drawn with fewer pixels.
- Cropping cuts away part of the picture. The framing changes, and the pixels that remain are untouched.
- Compressing leaves the dimensions alone and re-encodes the image using fewer bytes, discarding fine detail your eye is unlikely to miss.
For anything heading to the web, the best results come from doing two of them in order: resize down to the size the image will actually be displayed at, then compress. A photo that only ever appears 1200 pixels wide gains nothing from being stored at 4032 pixels, and no compression setting can recover that waste. Run the resized file through the Image Compressor - the guide to compressing an image covers quality settings in detail.
Aspect ratio, and why the lock matters
Aspect ratio is the relationship between width and height. A 4032×3024 photo is 4:3, because both numbers divide evenly by 1008 to give 4 and 3. Changing it without meaning to is what makes a picture look subtly wrong - people slightly too wide, circles turned into ovals. The Image Resizer ships with 'Lock aspect ratio' switched on: type a width and the height is calculated from the original proportions, and type a height and the width follows. Leave it on unless you need an exact size that does not match the source shape.
A worked example
Take that 4032×3024 phone photo and suppose you want it 1200 pixels wide for a blog post. Drop it into the Image Resizer and it reports 'Original: 4032×3024px'. With the lock on, type 1200 into the width box and the height snaps to 900 - because the original ratio is 4032 ÷ 3024 = 1.3333, and 1200 ÷ 1.3333 = 900. The numbers underneath are worth a look. The image is 3.36 times narrower (4032 ÷ 1200), but the pixel count falls from 12,192,768 to 1,080,000 - under 9 percent of the original, a reduction of about 91 percent. Pixel count scales with the square of the linear change, so shrinking each side by 3.36 times cuts the total by roughly 11 times over. On the page it looks identical, because the browser was squeezing those 4032 pixels into a 1200-pixel slot anyway.
Presets, and the one thing to watch
Four presets cover the sizes people ask for most: Instagram square 1080×1080, Instagram portrait 1080×1350, HD 1920×1080, and Thumbnail 150×150. Clicking one sets both numbers at once and deliberately switches the aspect-ratio lock off, since the point of a preset is an exact target size. That is the thing to watch: if your source shape does not match the preset, the image is stretched to fit. Forcing a 4:3 photo into the 1080×1080 square squeezes it horizontally by 25 percent - at that height it naturally wants to be 1440 wide. When the shapes differ, crop the picture to roughly the right proportions first, then apply the preset.
Why enlarging never adds detail
Resizing up is a different proposition. When you shrink an image the resizer chooses which of the existing pixels to keep; when you enlarge it, there is no extra information available, so new pixels have to be invented by interpolating between their neighbors. Take a 400-pixel-wide image up to 1600 and you get sixteen times the pixels and not one extra scrap of real detail - just softer edges and a blurred look. Always resize down from the largest original you have, and never treat an upscale as a way of recovering a low-resolution picture.
Choosing the right dimensions
Some sensible starting points for images viewed on a screen:
- Blog or article images: 1200 to 1600 pixels wide covers high-density displays that render at roughly double resolution.
- Full-width hero images: 1920 wide, which is exactly what the HD preset gives you.
- Instagram: 1080 wide - square for the feed, or 1080×1350 for the taller portrait format.
- Thumbnails, avatars and list icons: 150 to 400 pixels square.
- Print is calculated differently - physical size times DPI, not screen pixels. A 4 by 6 inch photo at 300 DPI needs 1200×1800, far more than a web page ever asks for.
How to resize an image, step by step
- Open the Image Resizer and drop your picture in - the original dimensions appear underneath it.
- Leave 'Lock aspect ratio' ticked and type your target width; the height fills itself in to keep the proportions.
- Or click a preset for an exact size - this unlocks the ratio, so crop to the right shape first if yours differs.
- Download the resized image. The file on your device is untouched, so the original is always still there.
Private, and what you get back
The resize happens entirely inside your browser tab - the image is redrawn at its new size on your own device, and nothing is uploaded to a server, so a photo you would rather not hand to a website never leaves your machine. The download arrives as a PNG named after its new dimensions, such as resized-1200x900.png. PNG is lossless, so the save costs no quality, but PNG photographs are large - for a web-ready file, pass the result through the Image Compressor for a JPG or WebP, or the Image Converter to change format only.
The bottom line
Resizing is about pixel dimensions, not file weight, and it is the fix for an image that is simply bigger than the place it is going. Keep the aspect ratio locked so nothing gets stretched, size down rather than up, and compress afterwards if it is bound for the web. Drop your photo into the Image Resizer, type one number, and download the result.
Frequently asked questions
- Does resizing an image reduce its quality?
- Shrinking an image does not visibly hurt quality - neighboring pixels are averaged together, so a downscaled photo still looks sharp at its new size, and the only detail lost is detail you could not have seen at that size anyway. Enlarging is the opposite: there is no extra information to draw on, so new pixels are interpolated from existing ones and the result looks soft. Always resize down from the largest original you have.
- What size should I resize an image to for a website?
- For most blog and article images, 1200 to 1600 pixels wide is ample - that covers high-density screens, which render at roughly double resolution. Use 1920 wide for a full-width hero, and 150 to 400 pixels for thumbnails and avatars. Match the width to the space the image actually occupies on the page; anything beyond that is bytes the visitor downloads and never sees.
- Are my images uploaded to a server when I resize them?
- No. The Image Resizer works entirely in your browser using your own device, so your images never leave your computer. There is no fixed file-size limit beyond your device's available memory, and the resized image downloads as a PNG named after its new dimensions, such as resized-1200x900.png.