Original—
Result—
Change—
Quality—
Shrink a photo without guessing. Drag the wipe handle to compare the compressed result against the original at full size, read the exact byte count for six quality levels at once, or give the tool a budget in kilobytes and let it search for the highest quality that fits.
Step by step
01Add the photo
Drop a file anywhere on the page or pick one in the inspector. It is decoded on your own machine — nothing is uploaded, so confidential and unreleased images are safe here.
02Choose the codec before the quality
JPEG and WebP are both lossy; PNG is absent because a lossless format has nothing to trade away. WebP is usually 25-35% smaller at the same visual quality, JPEG is the safer choice when the file must open in old software.
03Set a quality, or hand over a budget
Drag the slider and watch the byte count, or switch on the size budget and type a number of kilobytes. With a budget the quality axis is bisected ten times, landing on the largest file that still fits.
04Judge it on the wipe, not the number
Drag the divider across the picture to put compressed and original in the same pixels. Artefacts that are invisible at publication size do not matter, however alarming the quality percentage looks.
Worked example
Six encodes of the same photograph, which is what the ladder shows on every change. The shape below is what almost every photograph produces — and it is the reason a single quality number is a poor way to decide.
Given
Quality ladder - each rung re-encodes the same decoded bitmap
40% -> smallest file, visible blocking in flat sky
55% -> artefacts confined to fine texture
70% -> knee of the curve
80% -> ~1.4x the bytes of 70, no visible gain
90% -> ~2.5x the bytes of 70
100% -> largest file, mathematically near-losslessThe curve is steep below the knee and flat above it, so the interesting question is never 'which quality' but 'where does this photograph stop improving'. That point moves with the picture: flat skies and gradients break up early, dense foliage hides artefacts well past 60. The ladder shows you the answer for the file in front of you rather than a rule of thumb.
Before you ship it
Fewer pixels beats lower quality
A 4000px photograph displayed 800px wide is carrying 25 times the data it can show. Capping the longest edge first almost always produces a smaller, better-looking file than pushing the quality slider down on the full-size original, because resampling averages detail away instead of quantising it into blocks.
Re-encoding a JPEG can make it bigger
A file that has already been compressed carries the artefacts of that pass as real image detail, and the second encoder faithfully preserves them. If the output is larger than the input, that is what happened — switch codec or drop the quality further rather than repeating the pass.
The knee moves with the picture
Flat gradients, skies, and screenshots of solid colour band and block early. Dense texture, foliage, and noise hide the same artefacts far below 60%. There is no correct quality number, only a correct number for this image at the size you will display it.
A budget is a search, not a guarantee
Given a kilobyte limit the tool bisects the quality axis ten times and keeps the largest file that fits. If even the lowest quality overshoots, it says so with the overshoot in bytes — the honest answer at that point is fewer pixels or a different codec, not more searching.
JPEG has no transparency, and will fill it
Encoding an image with an alpha channel to JPEG composites it onto white first. If your logo suddenly has a white box around it, that is the reason — WebP keeps the alpha, and PNG is the right answer for flat graphics anyway.
Nothing is uploaded
Decoding, every quality probe, and the export all run on the canvas in your browser. Unreleased product shots and client photography never leave the machine, and the share link carries only the settings.
The judgement call
Compression is one of three ways to make an image smaller, and it is often not the right one.
A photo displayed 800px wide, stored at 4000px
Resize first
Nothing beats deleting pixels that were never going to be seen. Compress afterwards if it is still heavy.
A photograph for the web, any modern audience
WebP 70-80
The knee of the curve for most photographs, at roughly two thirds of the JPEG bytes for the same look.
A photo for an old system or a print workflow
JPEG 80
Universally readable, and 80 leaves enough headroom that a downstream re-encode will not visibly degrade it.
A logo, icon, or flat-colour graphic
Not here
Lossy codecs smear hard edges and flat fills. Use PNG through the format converter, or ship the SVG.
A screenshot with text in it
Not here
Text is the worst case for a lossy codec — ringing around every glyph. PNG or WebP lossless keeps it crisp.
An email attachment with a hard size limit
Budget mode
Give it the kilobytes and let the bisection find the best quality that fits, rather than guessing at the slider.
Reference
FAQ
Turn on the size budget in the inspector and enter your target in kilobytes — 200 for an email attachment, 100 for a fast-loading hero image. The tool encodes the picture repeatedly, bisecting the quality range, and keeps the highest quality whose output is still under your number. The footer then shows the achieved size and whether the budget was met.
For photographs, 70–80% is usually indistinguishable from the original at normal viewing sizes and roughly halves the file. Below about 50% the blocking artefacts around edges become visible. Rather than trusting these numbers, drag the wipe handle across a detailed area of your own image — faces, text, and sharp edges are where compression shows first.
WebP almost always produces a smaller file at equivalent visual quality, and every current browser supports it. Choose JPEG when the file will be opened by older desktop software, sent to a print shop, or uploaded to a service that rejects WebP. The quality ladder lets you compare both on your own image before deciding.
Your source was already compressed. Encoding a JPEG again at a higher quality than it was originally saved at spends bits describing the previous compression's artefacts. Lower the quality, switch to WebP, or cap the longest edge — any of the three will bring it back down.
Not by default — quality compression keeps every pixel and only changes how those pixels are encoded. If you also want fewer pixels, use the longest-edge slider, which downscales before encoding. For precise width and height control, the image resizer is the better tool.
No. The file is read locally, drawn to a canvas, and re-encoded by your browser. Nothing is transmitted, stored, or logged, and the page keeps working with the network disconnected. Share links carry your settings only, never the picture.
Compression runs entirely in your browser using the canvas encoder. Your photo is never uploaded, and the share link carries only the codec, quality, budget, and downscale settings.
Keep going
Image resizer
Set exact pixel dimensions with cover, contain, or stretch fitting.
Format converter
Encode the same picture as PNG, JPEG, and WebP and compare all three.
Metadata viewer
See what EXIF and GPS data is riding along, and strip it out.
Thumbnail generator
Produce fixed-size social cards with padding and rounded corners.