Image Compressor — Compress JPG, PNG & WebP Online

Compress images for faster pages and smaller uploads—quality presets, target KB sizes, and batch up to 25 files. Everything runs locally; nothing is uploaded.

Loading tool…

By Muhammad Abdullah Rauf · Founder, EverydayTools.proUpdated 2026

What is Image Compressor — Compress JPG, PNG & WebP Online?

Image Compressor reduces JPEG, PNG, and WebP file sizes using quality-based lossy compression or lossless re-encoding, entirely in your browser — no file is ever uploaded to a server.

Image Compressor is a free browser-based tool that reduces image file sizes using the HTML5 Canvas API and modern encoders. For JPEG and WebP, it re-encodes at a configurable quality level (1–100)—lower values increase quantization and shrink file size. For PNG, re-encoding strips EXIF metadata and applies deflate compression while preserving pixels.

Batch mode supports up to 25 images per session with Smart, Maximum, Best Quality, and target-size presets (50 KB, 100 KB, 200 KB). Optional resize-before-compress and format conversion (including WebP/AVIF where supported) run before quality tuning.

Use it before CMS uploads, email attachments, and e-commerce listings when you need smaller files without sending photos to a third-party server.

Quick answers

Concise answers for common searches — definitions, steps, and comparisons.

How does JPEG compression actually work?

JPEG compression converts image pixels into frequency data using the Discrete Cosine Transform (DCT). Each 8×8 pixel block is transformed into 64 frequency coefficients — a DC component (average brightness) and 63 AC components (fine detail). A quantization table then divides each coefficient by a divisor: larger divisors discard more detail. Low quality settings use large divisors, zeroing out high-frequency coefficients, which produces blocky 8×8 artifacts visible in smooth gradients. The compressed file stores only the surviving non-zero coefficients using Huffman coding. The 'quality' slider in image tools controls the scale factor applied to those quantization divisors — Q80 discards detail that human vision cannot easily detect at screen resolution, while Q40 discards enough that block boundaries become visible.

Why do photographs compress much better than screenshots in JPEG?

JPEG's DCT exploits spatial redundancy — neighboring pixels with similar colors produce small, efficiently-encoded AC coefficients. Natural photographs have smoothly varying gradients (sky, skin, foliage) where large image regions share similar frequency content, so the quantization step discards coefficients that were small to begin with. Screenshots and UI graphics contain sharp, high-contrast edges (text on white, colored buttons, icon outlines) where neighboring pixels change abruptly, producing large high-frequency coefficients that cannot be discarded without visible artifacts. A 1920×1080 photograph at Q80 may be 300–500 KB; the same pixel dimensions as a UI screenshot may be 900–1,500 KB at the same quality, because the screen content has more incompressible high-frequency content.

What JPEG quality level should I use for product photos on an e-commerce website?

Use Q80 as the baseline for all product images — it delivers 60–70% file size reduction versus the source with no visible quality difference at standard product listing size (typically 600–1200 px wide). For zoom-enabled product images where customers enlarge to 200%+, use Q85–90 to avoid block artifacts in fabric textures, jewelry reflections, or fine detail. For thumbnail grids (50–150 px), Q70–75 is acceptable since the small display size masks artifacts. Avoid Q60 or below for any image where color accuracy or sharp edges matter — JPEG's 8×8 block structure becomes visible in product backgrounds and gradients at that level. WebP at equivalent quality settings achieves the same visual result at 25–30% smaller file size and is supported by all major browsers.

How to use Image Compressor — Compress JPG, PNG & WebP Online

  1. Upload your image

    Drag and drop a JPEG, PNG, or WebP file onto the upload area, or click to browse. Files up to 20 MB are supported. The image is loaded into browser memory — nothing is sent to a server.

  2. Set the quality level

    Use the quality slider (1–100). For web use, 80 is the industry-standard default — it reduces most JPEG files by 60–70% with imperceptible quality loss. Use 85–90 for print output. Use 60–70 for maximum size reduction when exact quality is less critical.

  3. Preview side by side

    The tool shows the original and compressed images side by side with both file sizes. Inspect the compressed output at 100% zoom — look for block noise in gradients or blurring around sharp edges, which indicate the quality is too low for your content.

  4. Download the compressed image

    Click 'Download' to save the file. The output format matches the input (JPEG stays JPEG, PNG stays PNG). To change format while compressing, use the PNG to JPG or Image Converter tools.

Who uses Image Compressor — Compress JPG, PNG & WebP Online?

Common real-world scenarios where this tool saves time.

Web performance optimisation

Pre-compress images before deploying to production to reduce Largest Contentful Paint (LCP) time and improve Core Web Vitals scores — a direct Google ranking signal.

E-commerce product pages

Compress product photos before uploading to Shopify, WooCommerce, or Amazon to reduce storage costs, comply with platform file size limits, and accelerate product page load times.

Email newsletter images

Reduce campaign imagery to stay within email attachment limits (typically 10–25 MB total) without visible quality loss in inbox preview thumbnails.

CMS and blog publishing

Compress images before uploading to WordPress or a headless CMS to reduce server storage costs and improve mobile page speed for readers on cellular connections.

Social media pre-compression

Compress images before uploading to Instagram, LinkedIn, or Facebook. Platform auto-compression at upload is more aggressive than a manual Q80 compression, so pre-compressing gives you control over the final appearance seen by followers.

Workflow guides

Step-by-step chains that connect related tools for common tasks.

Web publish: resize → convert → compress

Resize removes excess pixels; format conversion picks the right encoder; compression fine-tunes byte size. Doing these in reverse wastes effort.

  1. Scale to display dimensions with Image Resizer (e.g. 1200 px wide for hero images).
  2. Convert JPEG/PNG to WebP with Image Converter for 25–35% smaller files at the same visual quality.
  3. Compress here at 80–85% quality to hit email or CMS limits.

Portal byte cap: use target-size tools

  1. If dimensions are already correct but a form enforces 50 KB, 100 KB, or 200 KB, skip manual quality guessing.
  2. Use Compress Image to 100KB (or 50 KB / 200 KB variants) to iterate quality automatically.

Image Compressor — Compress JPG, PNG & WebP Online examples

Product photo for e-commerce listing

Input

product-hero.jpg · 2.4 MB · 3000×2000 px · Quality: 80

Output

product-hero.jpg · 420 KB · 3000×2000 px (83% reduction)

At Q80, JPEG compression discards high-frequency detail that is invisible at normal product-photo viewing sizes. The 83% reduction cuts CDN storage and bandwidth costs significantly with no perceivable quality difference in the product listing.

PNG screenshot for documentation

Input

ui-screenshot.png · 840 KB · 1920×1080 px · Lossless re-encode

Output

ui-screenshot.png · 310 KB · 1920×1080 px (63% reduction)

PNG re-encoding strips embedded metadata (EXIF thumbnail, ICC profile, creation timestamps) and applies tighter deflate compression. Text and UI elements remain pixel-sharp because PNG compression is always lossless.

Website hero image — aggressive compression

Input

hero-landscape.jpg · 5.1 MB · 4200×2800 px · Quality: 70

Output

hero-landscape.jpg · 340 KB · 4200×2800 px (93% reduction)

At Q70, block artefacts may appear in smooth gradients (sky, skin) when zoomed to 200%. At normal browser display size they are invisible. If artefacts are unacceptable, use Q80 (~540 KB) for a safer result.

Methodology

Compression applies the HTMLCanvasElement.toDataURL() method with a quality parameter (0.0–1.0) that controls JPEG/WebP encoding fidelity. The quality value maps to the encoder's quantization tables — lower values discard more high-frequency detail in exchange for smaller file size. PNG re-encoding uses the browser's native deflate compression.

Sources

Reference tables

Image format compression comparison

FormatCompression TypeBest ForTransparencyTypical Web File Size
JPEGLossyPhotographs, complex imagesNo50–500 KB
PNGLosslessScreenshots, logos, text graphicsYes (alpha)100 KB–2 MB
WebPLossy & LosslessAll web images — modern browsersYes (alpha)30–300 KB
AVIFLossy & LosslessHigh-quality web at scaleYes (alpha)20–200 KB
GIFLossless (8-bit palette)Simple animationsYes (1-bit)20 KB–2 MB

JPEG quality level guide

Quality LevelTypical Size ReductionVisible Quality LossBest Use Case
90–10010–30%NonePrint, archiving, high-fidelity graphics
80–8950–70%ImperceptibleStandard web use, product photos, marketing images
70–7970–80%Minor — visible at 150%+ zoomThumbnails, social media, fast-loading pages
60–6980–90%Noticeable in smooth gradientsMaximum compression, small-screen display only
Below 6090%+Significant block artefactsFavicons, tiny thumbnails, bandwidth-critical use

When to use Image Compressor — Compress JPG, PNG & WebP Online vs related tools

Related toolUse this tool whenUse related tool when
Image ResizerThe image dimensions are already correct for your use case and you only need a smaller file size — for example, a 1200×800 px product photo that must be under 200 KB.The image is physically too large (e.g. 4000×3000 px from a camera) and must be scaled to web display dimensions. Resizing from 4000 px to 1200 px reduces pixel count by 91%, which typically shrinks the file more than quality-based compression alone.
PNG to JPG ConverterYou must stay in the original format (PNG for transparency support, or JPEG already) and only want to reduce file size within that format.The image is a photograph stored as PNG and you want maximum size reduction — switching from PNG to JPEG at Q80 typically reduces file size by 70–90%, far more than lossless PNG re-encoding can achieve.
Image ConverterYou need to stay in the same format and want fine control over the quality–size trade-off using a quality slider.You want to switch to a more efficient modern format like WebP or AVIF, which achieves 25–35% better compression than JPEG at the same visual quality — no manual quality tuning needed.
Compress Image to 100KBYou want manual control over the quality slider and are optimising for general web use rather than a specific file size target.A platform (job portal, form submission, avatar upload) enforces a specific maximum file size like 100 KB, 200 KB, or 50 KB, and you need the tool to hit that target automatically.

Best practices

Start at Q80 and adjust from there

Q80 is the industry-standard default for web images — it achieves 60–70% file size reduction for typical photographs with imperceptible quality loss. Only lower it if file size constraints demand it.

Always compress from the original source file

Compressing an already-compressed JPEG accumulates artefacts without meaningful size reduction. Keep originals in lossless format (RAW, TIFF, or PNG) and compress fresh for each delivery context.

Resize before compressing for web images

A 4000×3000 px image displayed at 1200 px wide wastes 11× the required pixels. Resize to display dimensions first using the Image Resizer, then compress — you will get a much smaller file with no quality penalty.

Use WebP for new web projects instead of JPEG

WebP achieves 25–35% better compression than JPEG at equivalent visual quality and supports transparency. All modern browsers support WebP. Only use JPEG for legacy software compatibility.

Preview at 100% zoom before downloading

Compression artefacts are invisible at small sizes but obvious at full resolution. Always inspect the output at 1:1 scale, especially for images users will zoom or enlarge.

Common mistakes to avoid

Compressing a PNG photograph and expecting a small file

Convert photographic PNGs to JPEG first (using PNG to JPG tool), then compress the JPEG. Or convert directly to WebP for the best size-to-quality ratio.

Double-compressing an already-compressed JPEG

Always compress from the highest-quality source available (original camera RAW or lossless export). Avoid the compress–edit–compress cycle.

Using Q100 and expecting lossless output from JPEG

If lossless is required (archiving, medical, legal documents), save as PNG or lossless WebP. Use JPEG Q80–90 for visual delivery only.

Compressing without previewing at 100% zoom

Always view the compressed output at 100% zoom before downloading, especially for images users will zoom into.

Expecting equal compression results for same-size images

Always evaluate the output file size after compression rather than predicting it from dimensions or file size alone.

Troubleshooting

Compressed image shows blocky squares or patches

Likely cause: JPEG quality set too low. The DCT 8×8 pixel block structure becomes visible when quantization is too aggressive — most noticeable in smooth gradients like sky or skin.

Fix:

PNG file size barely changed after compression

Likely cause: PNG is a lossless format — the canvas re-encode strips metadata but cannot discard image pixel data. True PNG size reduction requires palette quantization (pngquant), which is not available in browser-based canvas tools.

Fix:

Compressed image looks slightly different in colour

Likely cause: The canvas draw + re-encode pipeline strips the original ICC colour profile embedded in the JPEG. Without the profile, some monitors and image viewers display colours with a slight shift.

Fix:

Tool is slow on large images (over 10 MP)

Likely cause: Drawing a 12 MP image (4032×3024) onto an HTML canvas and re-encoding it requires processing ~49 million pixels, which is CPU-intensive and single-threaded in the browser.

Fix:

Compressed file is larger than the original

Likely cause: Some JPEG files are already compressed near the quality level selected. The browser encoder may produce a slightly larger output for the same quality setting depending on implementation.

Fix:

Advertisement

Frequently Asked Questions

Does compressing an image reduce quality?

Yes, for JPEG and WebP — both are lossy formats that permanently discard some image data to achieve smaller file sizes. At Q80, quality loss is imperceptible to most viewers. PNG compression is always lossless regardless of the setting, so PNG quality is never reduced.

What is the best quality setting for web images?

Q80 is the industry-standard default for web images. It reduces most JPEG files by 60–70% with no visible quality loss at normal screen viewing distances. Use Q85–90 for images users will zoom into, and Q70–75 for thumbnail-only images.

Are my images uploaded to a server when I use this tool?

No. All compression runs in your browser using the HTML Canvas API. Your images never leave your device — they are not uploaded, stored, or transmitted to any server. This makes the tool safe for personal photos, proprietary product images, and sensitive documents.

Can you compress an image without losing quality?

Yes, if the image is PNG or lossless WebP — both are lossless formats where every pixel is preserved exactly. For JPEG, lossless re-compression is not possible with standard tools; all JPEG compression is lossy by design.

How much can you compress an image without it looking bad?

Photographs typically tolerate Q70–80 before artefacts become noticeable in smooth gradient areas. Graphics with text, sharp edges, or flat colours start to show artefacts at Q75 or below. The exact threshold depends on image content — always preview before deciding.

What is the difference between lossy and lossless image compression?

Lossy compression (JPEG, WebP lossy) permanently discards image data to achieve smaller files — quality degrades slightly with each save cycle. Lossless compression (PNG, WebP lossless) stores every pixel exactly and can be decoded to the original without any quality loss.

Does this tool change the image dimensions?

No. Image Compressor only changes encoding quality — width and height are preserved exactly. To change dimensions, use the Image Resizer tool.

Is 80% JPEG quality good enough for a professional website?

Yes. Q80 is widely used by major platforms including Google, Facebook, and most CDN providers as the default compression level for user-uploaded images. The quality difference between Q80 and Q100 is not visible at normal screen resolution.

Why is my PNG not getting much smaller after compression?

PNG is a lossless format — browser-based re-encoding strips metadata but cannot discard image pixel data. For significant PNG size reduction, convert to WebP or JPEG (if transparency is not required), which can achieve 60–90% reduction for photographic content.

Is this image compressor free?

Yes — completely free, no signup required, no watermarks added, and no usage limits. All processing runs in your browser at no cost.

Should I resize or compress my image first?

Always resize first, then compress. A 4032×3024 camera photo resized to 1200×900 px for web use eliminates ~91% of pixels before any quality-based compression is applied. Compressing the original 4032 px image at Q80 sends 4032 pixels of data that the browser then scales down — wasting both bandwidth and processing. Use the Image Resizer to set the correct dimensions, then Image Compressor to fine-tune the file size.

Should I use WebP instead of JPEG for my website?

Yes, for modern web projects. WebP achieves 25–35% smaller files than JPEG at the same visual quality, supports transparency (unlike JPEG), and is supported by all major browsers since 2022. Use WebP for new web projects and public-facing pages where file size affects page speed. Use the Image Converter to switch from JPEG or PNG to WebP, then use Image Compressor if you need further size reduction beyond the format switch.

How do I compress an image to a specific file size like 100KB or 200KB?

Use the Compress Image to 100KB or Compress Image to 200KB tools (linked below) rather than adjusting the quality slider manually. These tools iterate through quality settings automatically until the output file is under the target size. The standard Image Compressor is better when you want manual quality control and aren't targeting a specific byte limit.

Privacy, accuracy, and trust

Privacy

All image processing runs entirely in your browser. No image data is uploaded to EverydayTools servers—files remain on your device.

Accuracy

Output file size and quality depend on the browser's native encoder. Results are consistent across Chrome 90+, Firefox 88+, and Safari 14+.

Part of Image Tools

Related Tools

More free tools for the same workflow.

Compress Image to 100KB

Compress or resize JPG, PNG, and WebP to under 100KB for job portals, government forms, and ID uploads. Runs locally in your browser—nothing uploaded. Batch ZIP download.

Compress Image to 50KB

Compress JPG or PNG images to under 50KB for government portals, passport photo uploads, visa applications, and strict ID submission requirements. No upload — runs in your browser.

HEIC to JPG Converter

Free HEIC to JPG converter — convert iPhone and iPad HEIC photos to JPEG format for sharing, uploading, and compatibility with Windows, Android, and web. No signup.

Advertisement

Reviewed by EverydayTools Editorial Team on 2026-05-20.