Resizing sounds trivial until a photo comes out stretched, or sharp until the moment you publish it. This guide covers the dimensions that actually matter and the two ways to change them.
Resizing changes how many pixels the image contains. The whole picture stays, it just gets bigger or smaller.
Cropping cuts part of the picture away. The remaining pixels keep their original detail.
If your image is the wrong shape — a 4:3 photo that needs to fill a 16:9 slot — you need to crop, not stretch. Stretching changes the aspect ratio and everything looks wrong: circles become ovals, faces look wider.
When you set a new width, let the height follow automatically. All decent resize tools do this when you specify only one dimension, or when you use a "longest side" mode:
Only set both width and height when you genuinely want to force a shape — and even then, crop first.
High-density screens show more physical pixels per CSS pixel. If a design slot is 400 CSS pixels wide, a 800-pixel image will look crisp on a retina display. The catch is file size: a 2× image has four times the pixels. A reasonable compromise for photos is 1.5×; for logos and text-heavy graphics, 2× is worth it.
Yes, but the detail is not there. Enlarging 2× means each original pixel becomes four — the software guesses the in-between values. It works acceptably for screenshots, logos and flat graphics, and noticeably worse for photographs. If you need a large print from a small file, start from the original rather than upscaling a compressed copy.
Resizing is pure pixel math — there is no reason to upload a photo to do it. Doing it in the browser keeps the original file untouched on your disk, avoids any quality surprises from a server's default settings, and means your images are not sitting on someone else's storage afterwards.
Try it now: Resize Image · Crop Image