Image

Crop vs Resize vs Compress: What Cropping Does to an Image

ToolOrbit Team 2 min readUpdated
Crop vs Resize vs Compress: What Cropping Does to an Image

Cropping is the simplest way to improve a photo: remove distractions, focus on the subject, or fit an image to a specific space. An online cropper lets you do this in seconds without installing software or uploading your picture anywhere.

What cropping does

Cropping keeps a rectangular region of the original and discards the rest. Because it simply selects existing pixels, a crop never reduces the quality of the area you keep — the kept region stays at full resolution.

Cropping an image to exact dimensions

  • Drag in or select an image.
  • Click and drag on the image to draw the area you want to keep.
  • Check the live selection dimensions shown beneath the image.
  • Click Crop & download to save just that region as a PNG.
Tip: the tool shows the selection size in real pixels, so you can crop to exact dimensions for a thumbnail, avatar, or banner.

Common uses

  • Trimming screenshots down to the relevant part
  • Creating square avatars from a larger photo
  • Removing watermargins, borders, or distractions
  • Fitting an image to a specific aspect ratio

Because the Image Cropper processes everything on your device with the canvas API, even sensitive screenshots stay private. Select, crop, and download — that is the whole flow.

How a crop changes the file size

Cropping both removes the edges and recomposes the image — but it does not automatically compress anything. A 4000px wide crop from a 6000px photo still needs to be downscaled for the web, and a JPG, PNG or WebP export applies its own compression settings on top. If you crop a small region from a huge photo and keep the same quality level, the export can be larger than you expect because all that detail is still there.

  • Crop first, then resize for the target slot, then compress.
  • Use the 1:1 view to frame the area you have lost — cropping is permanent.
  • For a quick web avatar, a 500×500 crop at modest JPG quality is plenty.
The Image Cropper output is fully client-side, so zooming and fine-position tweaks stay responsive even on very large originals.

Crop vs resize vs compress, quickly

The three different operations
OperationWhat it removesUse when
CropEdges of the frameYou want a different composition
ResizeResolution (pixels)You want the same view, smaller file
CompressDetail (quality)You want the smallest file at that view

The order matters: crop to the composition, resize to the display slot, compress to the budget. Skipping the middle step is the reason a “cropped” photo still weighs a megabyte — the pixel count never went down.


Tools mentioned

More reading

View all guides
When to Use Base64 Images (and When Not To)
Image

When to Use Base64 Images (and When Not To)

How to embed a Base64 image in HTML and CSS, when inlining helps, and the performance cost of doing it with large files.

2 min readUpdated
PNG vs JPG vs WebP: Which Image Format Should You Use?
Image

PNG vs JPG vs WebP: Which Image Format Should You Use?

When to pick PNG, JPG or WebP, what lossy and lossless really mean, and how to convert without throwing away quality.

2 min readUpdated
Why Rotating an Image by 90 Degrees Loses No Quality
Image

Why Rotating an Image by 90 Degrees Loses No Quality

Why right-angle rotation is lossless, how it differs from rotating by an arbitrary angle, and how EXIF orientation causes sideways photos.

2 min readUpdated
How Image Filters Work: Grayscale, Sepia, Contrast and Blur
Image

How Image Filters Work: Grayscale, Sepia, Contrast and Blur

What each image adjustment does, the order that gives the cleanest result, and three looks you can build from the sliders.

2 min readUpdated
Favicon Sizes: Which Ones You Need and How to Add Them
Image

Favicon Sizes: Which Ones You Need and How to Add Them

Which favicon sizes browsers, iPhones and Android actually use, how to turn a logo into a clear 16px icon, and how to test it before launch.

2 min readUpdated
How to Pick a Color from an Image (Copy HEX & RGB Codes)
Image

How to Pick a Color from an Image (Copy HEX & RGB Codes)

Pick exact HEX, RGB, and HSL color codes from any image. Extract dominant color palettes and copy color codes in 1 click.

2 min readUpdated
Your Photos Know Where You Live: How to Remove EXIF Data
Image

Your Photos Know Where You Live: How to Remove EXIF Data

Every phone photo embeds GPS coordinates, device details and timestamps. Here is what EXIF data reveals, who strips it for you, and how to remove it yourself.

3 min readUpdated
The Complete Guide to Image Optimization
Image

The Complete Guide to Image Optimization

Choose the right format, compress without visible loss, and serve responsive images that keep your pages fast.

2 min readUpdated