PDFGami Logo
v2.25.0
Free · Secure · Browser-Only

How to Crop an Image Without Losing Quality (or Transparency)

By AIC Innovation·Published ·7 min read

Cropping is the most-used edit there is, and it is also the one most online tools quietly get wrong: they crop the preview instead of the original, or they hand back a JPG with a white block where your transparent background used to be. This guide covers what a crop actually does to your pixels, which output format to pick, and how to do the whole thing in PDFGami's image cropper without the file leaving your device.

Open the Image Cropper

Crop an image in four steps

  1. 1
    Open the cropper. Go to pdfgami.com/crop-image. There is nothing to install, no account, and no watermark waiting at the end.
  2. 2
    Add the image. Drop a PNG, JPG, WebP or SVG onto the page, or press Ctrl+V to paste a screenshot straight from the clipboard. The picture appears on a checkerboard background, which is there so you can see where it is transparent.
  3. 3
    Set the crop. Drag inside the rectangle to move it and pull a corner or an edge to resize it. Rule-of-thirds guides sit across the selection to help you place a subject. Everything outside the rectangle is dimmed, so what you see bright is what you will get.
  4. 4
    Save or copy. Choose PNG, WebP or JPG under Save as, then click Download — the button shows the exact pixel size you are about to get. Or click Copy PNG and paste the crop straight into a document or a chat.

Can you crop an image without losing quality?

Mostly, and the caveat is worth understanding rather than skipping. A crop is subtraction: the pixels you keep are not stretched or resampled, they are the same pixels with fewer neighbours. Nothing about drawing a rectangle degrades an image. Two other things can.

The first is cropping from a downscaled preview. If a tool shrinks your 4000px photo to fit the screen and then cuts from that smaller copy, you lose most of the resolution before the crop even happens. PDFGami decodes the file onto a canvas at its full original size and keeps every crop coordinate in the image's own pixels, no matter how small the picture is being displayed. A selection you drag on a phone screen lands on exactly the pixels you saw.

The second is the output format, and this is where the honest answer differs from the marketing one. The crop has to be written back out as a file, and that encode is only as faithful as the format allows:

  • PNGLossless. The kept pixels are written out exactly as they were, alpha channel included. This is the safe answer whenever the image matters, and the default when you open a PNG.
  • WebPLossy at the quality setting you choose, but much more efficient than JPEG at the same visual quality, and it keeps transparency. A good middle ground for the web.
  • JPGLossy, always. Cropping a JPG means decoding it and encoding it again, which is a second generation of compression on top of the first. At the default 92% quality that is difficult to see, but it is real, and it accumulates if you keep re-cropping the same file.

So: cropping never re-compresses more than the format you chose requires. Pick PNG and the answer to “did I lose quality?” is genuinely no. Pick JPG and the answer is “a little, and here is why”. If your goal is a smaller file rather than a smaller frame, cropping is the wrong lever anyway — use the image compressor, which is built to trade quality for kilobytes deliberately.

Cropping a PNG and keeping transparency

This is the failure people notice most: you crop a transparent logo, open the result, and the background is a white rectangle — or, in the worst implementations, a black one. It happens for two reasons. Either the tool draws your image onto a canvas that starts filled with a colour, painting over the transparent pixels before anything is saved, or it exports JPEG regardless of what you put in, and JPEG has no alpha channel to store transparency in.

The cropper avoids both. The working canvas is cleared to fully transparent before your image is drawn onto it, so nothing is painted behind your pixels, and the output format defaults to whatever you put in — a PNG in gives a PNG out. PNG and WebP both carry the alpha channel through unchanged, which is why the format menu labels them “keeps transparency” when the image you loaded actually has transparent areas.

The one case where transparency cannot survive

JPG cannot store transparency — no JPG anywhere can. When you pick it, the transparent areas are filled with white. The tool does not let that happen quietly: if the image you loaded genuinely contains transparent pixels and you switch the format to JPG, a warning appears before you save, telling you the areas will be filled and suggesting PNG or WebP instead. If the image is fully opaque, there is nothing to lose and no warning to show.

If the image you are cropping does not have a transparent background yet but you want one, crop it first and then run it through the background remover. Doing it in that order means the remover has less area to work on and you are not erasing a background you were about to cut off anyway.

Ratio presets, and typing exact pixel numbers

Eight ratio buttons sit above the image: Free, Original, 1:1, 4:3, 3:2, 16:9, 4:5 and 9:16. Free lets the rectangle be any shape, and it is the only mode with edge handles, so you can pull in one side at a time. Original locks the selection to the proportions of the file you opened — what you want when the result has to drop into the same slot the original came from. Choosing a fixed ratio drops the largest rectangle of that shape into the middle of the image; from there you drag it where it should sit, and resizing from a corner holds the ratio for you.

Which ratio for what
  • 1:1 — profile pictures, app icons, product thumbnails, anything that will be shown in a square or a circle.
  • 16:9 — video thumbnails, slide backgrounds, wide hero images.
  • 4:3 / 3:2 — the classic camera shapes; 3:2 is what standard photo prints expect.
  • 4:5 / 9:16 — portrait posts and full-screen phone formats.

When a design calls for an exact size rather than a shape, use the four number fields under the picture: width, height, X and Y, all in the original image's pixels. Type 1200 into width and the selection is 1200px wide, full stop; X and Y place its top-left corner. With a ratio preset active, typing one side recalculates the other so the shape is kept. The numbers stay inside the image no matter what you type, and the Download button restates the final size — Download 1200 × 675 — so you can check it before committing. Click Reset at any time to go back to the whole image.

Screenshots: paste in, copy out

Most cropping is screenshot cropping — you grabbed the whole window and only need one panel of it. Saving a PNG to disk just to drag it back into a web page is pointless friction, so the cropper skips it: copy a screenshot however your system does it, then press Ctrl+V (Cmd+V on a Mac) anywhere on the page and the image loads. Pasting into a text field still works normally; the tool only claims a paste that is not aimed at one.

The return trip works too. Copy PNG puts the cropped result on your clipboard, ready to paste into a document, an issue tracker or a chat message, with no file landing in your downloads folder. It is always PNG, because that is the format clipboards handle reliably and it costs nothing in quality. Some browsers restrict clipboard writes; if yours refuses, the tool says so and Download is still there.

What happens when you crop an SVG

You can drop an SVG in, and it is worth knowing exactly what you get back. The file is rasterised first — rendered to pixels at 2048px on its long side — and the crop is taken from that bitmap. The result is a raster image, not a vector, and the tool states this on screen with the pixel size it used rather than letting you assume otherwise.

That is deliberate. Cropping the vector itself would mean rewriting its viewBox, which breaks on any file using transforms, percentage sizes or nested coordinate systems — a class of failure that looks fine in a preview and then falls apart wherever the file is actually used. A 2048px raster is honest and sharp enough for almost any screen use. If what you want is a clean conversion rather than a crop, the SVG to PNG converter lets you choose the long edge yourself — 512, 1024, 2048 or 4096px.

Formats the tool will not open

The cropper accepts PNG, JPG, WebP and SVG. Hand it a GIF, a HEIC photo from an iPhone, or a TIFF and it refuses by name rather than opening it and producing something misleading. A GIF may be animated, and pushing it through a canvas would flatten it to one still frame without telling you; HEIC and TIFF are not formats browsers can decode on their own, so a browser-only tool has nothing truthful to show. Convert the file to PNG or JPG first and the crop works normally.

The same reasoning governs where the work happens. Everything above runs as JavaScript in your own tab: the browser decodes the image, the crop is drawn onto a canvas, and the canvas encodes the file you download. Nothing is uploaded, so there is no queue, no size limit set by someone else's server, and no copy of your picture under a retention policy you did not read. The practical ceiling is your device's memory, because the full-resolution image lives in the tab while you work on it.

You do not have to take that on trust — and you should not take it on trust from any site that claims it. Open developer tools, switch to the Network tab, and crop an image. If a tool is uploading, you will see a request the size of your file. Here the tab stays quiet, and the page keeps working if you disconnect the network entirely, which is the check that cannot be faked.

Frequently asked questions

How do I crop an image without losing quality?

Two things have to be true. First, the crop must come from the full-resolution original rather than the preview you are looking at — PDFGami draws the decoded image onto a canvas at its real pixel size, so a selection made on a photo shown at 760px wide still cuts the original pixels. Second, the output format must not throw quality away: PNG is lossless, while saving as JPG re-encodes the image and always costs a little. If the picture matters, choose PNG.

Does cropping a JPG make it worse?

Slightly, yes, and any tool that tells you otherwise is glossing. A JPG has to be decoded to pixels to be cropped and then encoded again, so the result is a second-generation encode. At the default 92% quality that is very hard to see on a single pass, but it compounds if you crop the same picture over and over. Crop once from the best copy you have, or save the crop as PNG when you expect to edit it again later.

How do I crop a PNG and keep the transparent background?

Leave the output format on PNG, which is what the tool picks by default when you open a PNG. The working canvas starts fully transparent and the alpha channel is copied through the crop untouched, so a transparent logo stays transparent. WebP keeps it too. The only format that cannot is JPG — it has no alpha channel — and if you switch to JPG on an image that actually contains transparent pixels, the tool shows a warning before you save telling you those areas will be filled with white.

Are my images uploaded when I crop them online?

On most sites, yes: the usual design is an upload form, a server-side image library, and a download link, which means a copy of your picture sits on someone else's disk. PDFGami does not work that way — the image is decoded, cropped and re-encoded by JavaScript in your own tab. You can verify it: open developer tools, switch to the Network tab, and crop. No request carries the image, and the tool keeps working with the network disconnected.

What aspect ratios can I crop to?

Free, Original, 1:1, 4:3, 3:2, 16:9, 4:5 and 9:16. Free lets you drag any shape; Original locks the selection to the proportions of the image you opened. Picking a fixed ratio fits the largest rectangle of that shape into the image, centred — you then drag it where it should sit, and resizing from a corner holds the ratio for you.

Can I crop to an exact pixel size?

Yes. Below the picture are four number fields — width, height, X and Y — all in the original image's own pixels. Type 1200 into width and the selection is exactly 1200px wide; X and Y place its top-left corner. With a ratio preset active, typing one side recalculates the other. The Download button restates the exact output size before you save.

Can I crop several images at once?

No — the cropper takes one image at a time, because a crop rectangle is meaningful only against a specific picture. If you need the same treatment across a batch, the compressor handles up to thirty images in one pass and can resize them to a maximum width, and the image combiner joins several pictures into one.

Why will the tool not open my GIF or HEIC photo?

Because it accepts PNG, JPG, WebP and SVG only, and it says so rather than opening the file and producing something wrong. A GIF may be animated, and cropping it through a canvas would silently flatten it to one still frame. HEIC — what an iPhone often saves — and TIFF are not formats browsers decode natively. Convert to PNG or JPG first and the crop works normally.

Continue reading

Crop your image now

Drop a picture or paste a screenshot, drag the rectangle, download or copy the result. Full resolution, transparency intact, and the file never leaves your device — like every other tool on the image tools page.

Open the Image Cropper