Compress JPEG, PNG, or WebP images locally on your browser. Optimize dimension files to save hosting bandwidth.
Image compression reduces the file size of digital photographs and graphics by encoding pixel data more efficiently. For web applications, mobile apps, and email attachments, image compression is one of the most impactful optimizations available — images typically account for 60-75% of total page weight, and reducing image sizes directly improves page load speed, Core Web Vitals metrics, and mobile data consumption.
This browser-based image compressor uses the Canvas API's built-in JPEG quality encoder and PNG optimization algorithms, running entirely in your browser without uploading files to any server. Compress single images or batch process multiple files, adjust quality thresholds, and compare the compressed output visually against the original before downloading.
JPEG (Joint Photographic Experts Group) uses lossy DCT (Discrete Cosine Transform) compression. The image is divided into 8×8 pixel blocks; DCT transforms each block to the frequency domain; high-frequency components (fine detail) are quantized more aggressively than low-frequency components (broad tonal areas). Higher quality settings preserve more high-frequency data; lower settings produce smaller files but introduce visible blockiness and color banding artifacts called JPEG artifacts.
PNG uses lossless compression combining the Deflate algorithm (LZ77 + Huffman encoding) with per-row filter predictors that improve compressibility. PNG never degrades image quality — repeated save/load cycles produce bit-identical results. PNG is optimal for images requiring exact pixel accuracy: screenshots, diagrams, logos with text, pixel art, and any image needing transparency (alpha channel). For photographs with smooth tonal gradients, JPEG achieves much higher compression ratios than PNG at equivalent visual quality.
WebP (developed by Google) provides 25-34% smaller file sizes than JPEG at equivalent quality using more sophisticated intra-frame prediction. WebP supports both lossy and lossless modes, animation (replacing GIF), and transparency (replacing PNG in many cases). Browser support is now universal across modern browsers.
AVIF (AV1 Image File Format) achieves 50% better compression than JPEG at equivalent quality, using codec technology derived from the AV1 video standard. AVIF's superior compression comes with higher encoding time. JPEG XL offers progressive decoding, lossless recompression of existing JPEGs, and excellent quality/compression tradeoffs — though its standardization progress has been complex.
For web use, JPEG quality 70-80% typically provides excellent visual quality with 60-70% file size reduction versus quality 100%. Quality 60-70% works well for thumbnail images and background textures where artifacts are less noticeable. Quality 85-90% is appropriate for hero images and product photos where fine detail matters. Avoid quality above 90% for web use — the file size penalty far outweighs the marginal quality gain.
Use PNG for: images with text overlay (JPEG artifacts make text unreadable), logos and graphics with flat colors, screenshots of software UI, images requiring transparency/alpha channel, pixel art requiring exact color reproduction, and any image where quality must be preserved through multiple edit cycles. Use JPEG for photographs and natural scenes where some quality loss is acceptable in exchange for smaller files.
For typical photographs, JPEG quality 75-85% is visually lossless to most viewers. The exact threshold varies by image content: images with fine texture detail (fabric, grass, hair) show artifacts earlier; smooth tonal areas (sky, skin) tolerate lower quality settings. The double-JPEG artifact (compressing an already-compressed JPEG) is more visible than first-generation compression at the same quality setting.
JPEG compression can introduce subtle color shifts in chroma (color) channels because JPEG typically subsamples chroma at 4:2:0 (half horizontal and vertical resolution), exploiting the eye's lower color resolution sensitivity compared to luminance. This chroma subsampling is usually imperceptible in photographs but may be unacceptable for color-critical applications like graphic design, printing, or product photography.
Lossless compression (PNG, GIF) reduces file size without losing any pixel data — decoding restores the exact original image bit-for-bit. Lossy compression (JPEG, WebP lossy mode) discards information that is psychovisually less important, achieving higher compression ratios but permanently altering pixel values. The original cannot be recovered from the compressed version. Choose lossless for archival and editing masters; lossy for delivery and web use.