Image Cropper

Choose an image, then enter the crop rectangle — the left/top offset and the width/height in pixels. The cropped region is drawn onto a canvas and offered as a download. Everything is processed on your device; the file is never uploaded.

Choose an image, set the crop box, then press Crop image.

How cropping works

Cropping keeps a rectangle of the original image and discards the rest — unlike resizing, the kept pixels are untouched, so there is no quality loss. You define the rectangle with a top-left corner (X, Y) and a size (width, height), measured in pixels from the image's top-left origin.

kept region = ( X, Y ) → ( X + width, Y + height )

The tool draws that source rectangle onto a canvas sized exactly to the crop and exports it as a PNG. Any rectangle that runs past the image edge is clamped so the crop never includes blank pixels.

Worked example

Take a 200 × 200 square from the centre of a 1000 × 800 image:

Left X: (1000 − 200) ÷ 2 = 400.
Top Y: (800 − 200) ÷ 2 = 300.
Crop: X = 400, Y = 300, width = 200, height = 200 → a centred 200 × 200 thumbnail.

Tips and privacy

The pixels inside your crop are copied exactly, so cropping is lossless. To get a perfectly square avatar, use equal width and height; to follow a known ratio like 16:9, keep width ÷ height = 1.778. Because the crop is performed on the canvas in your browser, the image is never uploaded — it is safe for private screenshots and unreleased artwork.

Tip: need to change the overall size instead? Use the image resizer. To embed a small crop in CSS, convert it with the image to Base64 converter.

Frequently asked questions

Does cropping reduce quality?

No. Cropping keeps the original pixels inside your rectangle unchanged and simply discards the rest, so there is no re-compression or blurring — unlike resizing, which interpolates pixels.

Where is X = 0, Y = 0?

At the top-left corner of the image. X increases to the right and Y increases downward, both measured in pixels, which matches how the canvas and CSS coordinate systems work.

What if my crop runs off the edge?

The tool clamps the rectangle to the image bounds, so the crop is trimmed to whatever real pixels exist rather than padding the edges with blank space.

Is my image uploaded?

No. The file is read locally and cropped on a canvas in your browser. Nothing is sent to a server, so private images stay on your device.

MB
Mustafa Bilgic · Editor, Calcool
Crops with the HTML canvas drawImage source-rectangle. Everything runs in your browser - nothing you enter is uploaded, logged or stored.

Related calculators

🔧 Image Resizer🖼️ Image to Base64🧩 Base64 to Image🎨 Color Picker