Image Cropper — Guide

Crop an image to an exact pixel region in your browser — drag the box, lock a ratio, and export at the true source resolution, not a scaled-down copy.

What it is and when to use it

Crop a photo to the region you actually want, in the browser, and get back a file whose dimensions are the crop's dimensions in the original image. That last part is the difference between this and a naive cropper: the box you drag lives in image coordinates, and the export calls drawImage with a source rectangle on the untouched bitmap, so shrinking the preview to fit your window never shrinks the result. Lock a ratio when the destination demands one — 1:1 for avatars, 4:3 or 3:2 for print crops, 16:9 for social embeds — and the box keeps its proportions while you drag. Re-encoding is unavoidable when you export to JPEG or WebP, so quality is exposed as a slider; PNG export stays lossless and keeps transparency.

Drag a selection over an image and crop it to that exact region, exporting at the source resolution rather than a scaled-down copy of what you saw on screen.

How to use it

  1. Pick an image
  2. Drag inside the box to move it, or drag a corner to resize; optionally lock a ratio
  3. Choose the format and crop

Things that trip people up

  • The crop is taken from the original pixels, not from the on-screen preview — a 640px-wide preview of a 4000px photo still crops at full resolution.
  • The selection is always clamped inside the image, so you cannot accidentally crop a region that does not exist.
  • Available output formats are probed from the browser at runtime; formats a browser cannot genuinely encode are not offered.

Questions people ask

Does cropping reduce image quality?
The crop itself does not: it selects a rectangle of existing pixels. Quality loss only enters at export, and only for lossy formats. Choose PNG if the crop must stay pixel-exact, and JPEG or WebP when file size matters more.
Why is the exported file smaller than the image I see?
Because the export is the size of your selection, not of the whole image. The readout next to the box shows the exact output dimensions before you commit.
Can I crop to an exact size like 800×600?
Crop to the region you want and check the reported selection size, then fine-tune. The preview is scaled to fit the window, so the numbers shown are always the real image pixels, not the on-screen size.
Does it keep transparency?
Yes when you export to PNG or WebP. Exporting to JPEG flattens transparency onto an opaque background, because JPEG has no alpha channel at all.
Why can I not pick my phone photo?
If the browser cannot decode the file, nothing can be drawn from it. HEIC from iPhone and most TIFF files fall into that category — convert those first, or use a tool that ships a dedicated decoder.

Next steps

Open the Image Cropper tool

Spotted something wrong on this page? Tell us via Contact Us