How to crop an image online with exact pixel coordinates

Drag a box over the photo, or type the four numbers. Both stay in sync, and the crop happens on your device.

Cropping is a two-second job that turns into a ten-minute one when the tool insists on a fixed shape or hides the pixel values behind a drag handle. The image cropper gives you a selection rectangle you can drag anywhere, plus the four numbers behind it.

Try it — drop a photo and drag a selection

How it works

  1. Drop a photo. A selection box appears over the middle 80% of the frame.
  2. Drag inside the box to move it, pull a corner handle to resize it, or drag on the dark area outside to start a fresh selection.
  3. Adjust X, Y, width, and height directly if you need round numbers, then download as PNG, JPEG, or WebP.

The numbers and the box are the same thing

The crop rectangle lives in the image's own pixel coordinates, not in screen coordinates. A 6000 pixel wide photo displayed at 620 pixels still reports a crop of 2400 by 1600 rather than whatever the preview happened to measure. Drag the box and the fields update. Type into the fields and the box moves. Resize the browser window and the numbers hold steady while the box redraws at the new scale.

This matters when a spec is precise. "Take the top-left 512 by 512" is a five-second job: type four numbers and download. Guessing at it with a mouse takes far longer and lands a few pixels off.

Ratio locks, and when to skip them

Pick 1:1, 4:3, 16:9, or 3:2 and the box keeps that shape while you drag a corner. Free mode lets the rectangle be any shape at all.

The ratio lock is for output that has to fit a slot: a square avatar, a 16:9 video thumbnail, a 3:2 print. If you already know the platform, the social media cropper carries the current dimensions for Instagram, Threads, Bluesky, and the rest, so you do not have to look them up. Use free mode when the subject decides the shape rather than the destination, which covers most photo work.

Cropping does not degrade the pixels you keep

The kept region is copied one to one onto a new canvas, with no scaling or resampling in between. The only quality question is the format you save to. PNG stores the crop exactly as it came out. JPEG and WebP re-encode it once, which is invisible at normal quality settings but does accumulate if you crop the same photo four times in a row. PNG is the default here for that reason.

If the crop still comes out larger than you want, run it through the resizer or the compressor afterwards.

Where the file goes

Nowhere. The browser reads the file, decodes it, and draws the selected region onto a canvas element, and the download comes off that canvas in memory. There is no upload step anywhere in the code. Worth knowing if what you are about to crop is an ID or a medical scan.