🖼 Image Cropper
Crop to a locked aspect ratio and set the exact output pixels — in px, inches, cm or mm at any DPI. Warns before it enlarges. Runs in your browser.
Choose an image, or drop it here
Cropped in this tab — nothing is uploaded.
What Image Cropper Does
Cropping and resizing solve different problems and people reach for the wrong one constantly. Resizing keeps the whole picture and changes its pixel dimensions; if the new dimensions are a different shape, the picture is stretched. Cropping changes the shape by discarding what falls outside the box, and what remains keeps its proportions exactly. A 4:3 image from a 3:2 photo can only come from a crop — resizing to those numbers would squash it by about 11%.
An aspect ratio is a shape, not a size. 4:3 describes 800 × 600 and 4000 × 3000 equally well, and knowing you have cropped to 4:3 tells you nothing about whether the file will print. That is why the output size is set separately here: choose the shape with the crop box, then choose the size in pixels, inches, centimetres or millimetres at a resolution you pick.
The number that decides whether the result is any good is the one nobody shows you: how many megapixels are actually in the selection. Drag a small box on a large photo and ask for a 300 DPI print and you are enlarging a crop — the extra pixels are interpolated and the print is soft. The selection and the request are shown side by side, in megapixels, before you commit.
The crop rectangle is tracked in the source image’s own pixels rather than in display pixels. That sounds like an implementation detail and is not: a box tracked on screen rounds through the display scale on every drag, so the numbers drift by a pixel or two as you nudge it — which is exactly the off-by-one that fails a form demanding 413 × 531.
How to Use Image Cropper
- Add an image, or drop it onto the box
- Pick a shape — 4:3, 1:1, 16:9, 35×45 mm — or type any two numbers as a ratio
- Drag the box to choose the part of the picture you want; the shape stays locked
- Optionally set an exact output size in pixels, inches, cm or mm, then crop and save
Formula Used by Image Cropper
The largest crop of a given shape that fits
if (imageW ÷ ratio) ≤ imageH then w = imageW, h = imageW ÷ ratio; otherwise h = imageH, w = imageH × ratio
- ratio
- the wanted shape as width ÷ height — 4:3 is 1.333, 9:16 is 0.5625
- w, h
- the crop rectangle, then centred in the image
Worked example
A 4032 × 3024 phone photo (4:3) cropped to 16:9.
- ratio = 16 ÷ 9 = 1.7778
- Try full width: 4032 ÷ 1.7778 = 2268, which is ≤ 3024, so width leads.
- Crop is 4032 × 2268, centred: y = (3024 − 2268) ÷ 2 = 378
Result: 4032 × 2268 at (0, 378). 25% of the image height is discarded — which is what changing shape costs.
How much you can enlarge before it shows
enlargement = outputPixels ÷ selectionPixels (per axis)
- selectionPixels
- the crop box measured in the original image, not on screen
- outputPixels
- what you asked the file to be
Worked example
A 900 × 1200 selection saved as a 2 × 2 inch ID photo at 300 DPI, i.e. 600 × 600.
- The selection is 3:4, the output is 1:1 — the shapes disagree, so lock the ratio to 1:1 first.
- With the shapes matched, a 900 × 900 selection to a 600 × 600 output is a reduction of 0.67×.
- Reduction is safe. The warning only appears the other way round.
Result: Fine. Had the selection been 400 × 400, the same output would be a 1.5× enlargement and visibly soft.
Ratios, and the pixel sizes people actually want from them
The shape is the crop; the pixels are the output size. Both are set separately here because they answer different questions.
| Ratio | Typical use | A common pixel size |
|---|---|---|
| 1:1 | Profile pictures, Instagram posts | 1080 × 1080 |
| 4:3 | Classic photography, presentations, projectors | 1600 × 1200 |
| 3:4 | Portrait photographs, ID-adjacent shapes | 1200 × 1600 |
| 3:2 | 35 mm film, most DSLRs, 6×4 inch prints | 1800 × 1200 at 300 DPI |
| 16:9 | YouTube thumbnails, widescreen displays | 1920 × 1080 |
| 9:16 | Stories, Reels, TikTok | 1080 × 1920 |
| 4:5 | Instagram portrait, Pinterest | 1080 × 1350 |
| 1:2 | Tall banners, the shape people type as "2×4" | 600 × 1200 |
| 7:5 | 7×5 inch prints | 2100 × 1500 at 300 DPI |
| 5:4 | 10×8 inch prints | 3000 × 2400 at 300 DPI |
Physical sizes to pixels, at the two resolutions that matter
The same shape at two resolutions is two very different files. 300 DPI is the print standard; 150 is enough for something viewed at arm’s length.
| Size | Ratio | At 150 DPI | At 300 DPI |
|---|---|---|---|
| 2 × 2 in (ID photo) | 1:1 | 300 × 300 | 600 × 600 |
| 35 × 45 mm (ID photo) | 7:9 | 207 × 266 | 413 × 531 |
| 6 × 4 in (photo print) | 3:2 | 900 × 600 | 1800 × 1200 |
| 7 × 5 in (photo print) | 7:5 | 1050 × 750 | 2100 × 1500 |
| 10 × 8 in (photo print) | 5:4 | 1500 × 1200 | 3000 × 2400 |
| A4 (210 × 297 mm) | ≈ 1:1.414 | 1240 × 1754 | 2480 × 3508 |
How to Read Your Result
Crop first, resize second — never the other way round
Resizing to a shape you do not have distorts the picture, and cropping afterwards cannot undo it. Getting the shape right with a locked crop box and only then choosing the pixel dimensions means the proportions are correct at every step and the only thing you ever lose is the area you deliberately cut away.
Reducing is free, enlarging is not
Scaling a selection down averages several real pixels into each new one and looks sharp. Scaling up has nothing to average and has to guess. Ten to twenty percent passes unnoticed; doubling is visibly soft. If the megapixel figures show you are enlarging, the honest fix is to select a larger area, not to accept a bigger number.
A shape is not a compliant ID photo
The 35 × 45 mm and 2 × 2 inch presets get the geometry right, and geometry is only part of what an ID photo has to satisfy. Head height within the frame, background colour, expression and lighting are usually specified too, and no cropper can check them. Use this for the shape and the pixels, and check the rest against the requirements you were actually given.
Limitations & Accuracy Notes
- Rectangular crops only, aligned to the image. There is no rotation, straightening or free-angle crop here.
- No zoom on the crop surface, so on a very large image the fine positioning is limited by how big the preview is on your screen. The numeric readout shows the exact selection in source pixels.
- No face detection or automatic subject centring — you choose the area.
- EXIF, GPS and colour profiles are dropped by the re-encode. The EXIF rotation is applied to the pixels first, so nothing comes out sideways.
- The preview is downscaled for display, but the crop itself is always computed against the full-resolution image, so no quality is lost to the preview.
Frequently Asked Questions
How do I crop an image to a 4:3 ratio?
What is the difference between cropping and resizing?
Can I set the exact pixel size as well as the shape?
Why does it warn me about enlarging?
What is the rule-of-thirds grid for?
Can I crop to a passport or ID photo shape?
Are my images uploaded?
References & Further Reading
- MDN — CanvasRenderingContext2D.drawImage() — The nine-argument form, which takes the source rectangle — this is the crop
- MDN — createImageBitmap() — Decoding with the EXIF orientation applied, so the crop box sits on the image the right way up
- MDN — HTMLCanvasElement.toBlob()