Most image editing happens on a server. You upload the file, the server processes it, and you download the result. This tool works differently: it reads your image directly in your browser, edits it using the browser's built-in graphics pipeline, and produces the output file on your device. Your photo never leaves your machine.
The practical benefit is privacy. A photo you're cropping might contain a location, a face, a document, or anything else you'd rather not route through a third-party server. With client-side processing, there's nothing to intercept.
The browser's Canvas API provides a 2D drawing context that can read pixel data from images and draw subregions of them. Cropping an image involves three steps:
HTMLImageElement from the selected file.drawImage() with the source image and the crop coordinates — the x, y, width, and height of the rectangle you've selected on screen.
The Canvas now contains exactly the pixels inside your crop. Calling
canvas.toBlob() converts those pixels to the output format you choose —
JPEG or PNG — which is then offered as a download.
The drag-to-select interface draws a rectangle overlay on the image preview. The overlay is tracked in the image's native coordinates (not the display coordinates), so the crop is always at full resolution regardless of how large or small the preview is on your screen. When you move or resize the crop handle, the pixel coordinates update in real time. The crop is only committed when you click Download.
Aspect ratio lock lets you constrain the crop to a fixed ratio — 1:1 for profile photos, 16:9 for video thumbnails, 4:3 for presentations. When locked, dragging any handle adjusts both dimensions while keeping the ratio constant.
After cropping, you can specify output dimensions. The Canvas is drawn at the target size using bilinear interpolation — the browser's default resampling algorithm. For most downscaling tasks, this produces clean results. If you're scaling up (enlarging a small image), the result will be softer than the original — that's a fundamental limitation of pixel-based upscaling, not a tool limitation.
iPhones and modern Android cameras often save photos in HEIC (High Efficiency Image Container) format. Most web tools can't handle HEIC directly. This tool includes a WASM-based HEIC decoder that converts the file to a pixel buffer in your browser before passing it to the Canvas pipeline. The conversion is handled entirely locally — the HEIC file is never uploaded.
HEIC files are typically larger than their preview image suggests because the container can hold multiple representations (thumbnail, full-res, depth map). The decoder extracts the primary full-resolution image.
If you need to crop multiple images to the same dimensions — product photos for an e-commerce catalogue, for example — you can process them one at a time and use the ZIP download to collect all the results in a single archive. Each image is processed independently and the ZIP is assembled in the browser.
Bloggers crop featured images to fixed aspect ratios before uploading to WordPress. Developers crop screenshots for documentation. HR teams crop profile photos to uniform dimensions for staff directories. Social media managers crop images to platform-specific dimensions. Anyone who handles photos on a device they'd rather not expose to a third-party server.