Image cropper
Crop an image by dragging a selection on a canvas, lock it to 1:1 / 4:3 / 16:9, watch the live pixel coordinates and export as PNG or JPEG.
Runs in your browserEvery computation happens in your browser — your data never leaves this device.
Images are processed locally in your browser and never uploaded
Drag on the image to draw a selection, drag inside it to move, and drag the square handles to resize.
Pick an image first
The cropped size and file size show up here after exporting.
What this tool does
- Crop a screenshot or photo to a fixed ratio: 1:1 for an avatar, 4:3 or 16:9 for a cover image — the selection ratio stays locked.
- Trim interface chrome, watermarks or black borders from a screenshot, then export as PNG (lossless) or JPEG (smaller).
- Work at exact coordinates when it matters: the selection position and size update live, so you can see the pixel-accurate landing spot before exporting.
- Trial-run a crop before scripting: settle the frame position and the output file size here, then decide whether batch processing is worth it.
Example
Input
Original 4000 × 3000 with the 1:1 preset selected
Output
Selection x=500, y=0, width 3000, height 3000 Export filename photo.png → photo-cropped.jpg
Selection coordinates are display coordinates; the tool scales them to original pixels before cropping. The numbers here are the real result of the centred square calculation (largest centred rectangle for 1:1). The crop itself needs the browser canvas and cannot be verified offline, so what is shown is the deterministic geometry result.
Frequently asked questions
Are my images uploaded?
No. The image is decoded in the browser and drawn onto a local canvas; cropping and exporting (toBlob) happen in memory. There is no upload endpoint, and it works offline.
What is the difference between exporting JPEG and PNG?
PNG is lossless and supports an alpha channel but gets large for photographic content. JPEG is much smaller yet re-compresses on every export (more visibly at lower quality settings) and has no transparency — transparent areas get filled with the background color. Pick PNG when you need alpha.
Why does the selection stop when I drag towards the edge?
The selection is clamped to the canvas, so it stops rather than leaving the image, and resizing enforces a minimum edge length (8 px by default). If dragging seems to do nothing, check whether you grabbed the inside of the selection (that moves it) instead of a corner handle (that resizes it).
Why is the size with a locked ratio not what I expected?
Locking the ratio derives the other edge from the longer one and still respects the canvas bounds, so the size stops at the edge. Switch to the free preset to position the frame roughly, then lock the ratio and fine-tune.
Does cropping hurt image quality?
Cropping itself only redraws pixels and does not degrade them. Exporting as JPEG does introduce compression loss, so export PNG for pixel-perfect results. For very large originals it is better to downscale with the image resizer first and crop afterwards.
Keywords：图片裁剪裁剪工具crop imageimage cropper宽高比1:1 裁剪canvas crop图片编辑