Image Cropper
Drag a selection box over your image, lock an aspect ratio like 1:1 or 9:16, and export the crop at native resolution as PNG, JPEG or WebP.
The crop is drawn and encoded entirely in your browser. Your image never leaves your device.
Crop your image
Drop an image here
PNG, JPG, WebP, GIF · up to ~50 MB
How Cropping Works
The preview you see is scaled down to fit the stage, but the crop is never taken from that preview. Every rectangle you drag is converted back into the source image's own pixel space before anything is drawn, so the export carries real pixels from the original file.
- Display space vs. native space
- The selection lives in screen coordinates: a box at (x, y) that is w wide on a preview that is, say, 640 px across. To crop, the tool multiplies by naturalWidth ÷ displayedWidth — for a 4000 px photo shown in a 640 px preview that factor is 6.25, so a 192 px wide box becomes a 1200 px wide cut. Height uses the same factor, and the source rectangle is copied 1:1, so no resampling happens at any zoom level.
- Why 9:16 is on the list
- Stories, Shorts, Reels and TikTok are vertical 9:16 — 1080 × 1920 is the canonical render. With the ratio locked, dragging a corner gives you that frame exactly instead of nudging a free box by eye; 3:2 (classic camera ratio) and 4:3 (presentations, most sensors) sit next to it for the same reason.
- The honest note about GIFs
- A GIF can hold dozens of frames, but the browser hands the Canvas API only the first one, and canvas cannot encode an animation. Load an animated GIF and you are cropping a still: that first frame, exported as PNG, JPEG or WebP. Nothing here can preserve the animation.
Frequently Asked Questions
Does cropping reduce the quality of my image?
No. Cropping throws pixels away, it never resamples them — the box you drag on screen is mapped back to the original file's coordinates, so a 4000 × 3000 photo cropped to a 1200 × 800 area exports exactly those 1200 × 800 native pixels. The only thing that can soften the result is the encoder, and that applies to JPEG and WebP output (quality 0.92 here); PNG output is lossless.
Can I crop with a finger on a phone?
Yes. The selection box and its eight handles respond to pointer events, which cover mouse, touch and stylus, and each drag captures the pointer so your finger can slide off a handle without losing the selection. Page scrolling is left alone — the crop box simply sits on top of the preview.
What happens to transparent areas if I choose JPEG?
JPEG has no alpha channel, so anything transparent inside the cropped region is flattened onto a white fill before encoding. If you need to keep transparency, export as PNG (the default) or WebP — both carry an alpha channel and preserve the edges of cut-out shapes exactly.
Can I crop an animated GIF?
You can load one, but the browser exposes only its first frame to the Canvas API and canvas cannot write animated GIFs. The result is a still PNG, JPEG or WebP of that first frame. Nothing is lost from your original file, but the animation is not carried over.
Is anything uploaded to a server?
No. The file is read with a local FileReader, decoded by the browser, and the crop is drawn and encoded in memory. There is no upload request, no account and no storage — disconnect your network and the tool still works.