WebP Lossless Compression: Perfect Quality, Smaller Files

WebP lossless mode preserves every pixel exactly using the VP8L codec, producing files around 26% smaller than equivalent PNG images with no data loss.

WebP lossless compression reconstructs your image bit-for-bit identically to the original — every pixel value is preserved exactly. This makes it the right choice for UI assets, logos, icons, and screenshots where sharp edges, flat colour areas, and text rendering must remain pixel-perfect. By switching from PNG to WebP lossless you typically reduce file sizes by around 26% with zero sacrifice in image quality.

How It Works #

WebP lossless uses the VP8L codec, a purpose-built lossless image encoder that combines multiple compression techniques applied in sequence:

LZ77 Backwards References #

The encoder scans for repeated pixel sequences within the image and replaces duplicates with compact references to where the sequence previously appeared. Flat-colour regions and repeating patterns compress especially well under this scheme.

Huffman Coding #

After LZ77, the remaining symbol stream is entropy-coded using canonical Huffman codes. The encoder builds optimal code tables per image tile, squeezing out the remaining statistical redundancy.

Colour Transform #

A colour transform step decorrelates the red, green, and blue channels before compression. By expressing R and B relative to G, the encoder reduces variance across channels and improves the effectiveness of subsequent entropy coding.

Colour Index Transform #

For images with a small number of distinct colours, VP8L can replace full RGB values with palette indices, mirroring the approach PNG uses for indexed-colour images but with more efficient entropy coding.

Comparison with PNG #

Google’s published WebP study benchmarked lossless WebP against PNG across a large corpus of web images and found that WebP lossless files are on average 26% smaller than their PNG equivalents. Encode time is also competitive: VP8L’s compression pipeline is designed to be parallelisable and typically completes faster than libpng at comparable compression levels.

The 26% size reduction is an average. Images with complex photographic detail stored as PNG (uncommon but possible) may see smaller gains, while images with large flat-colour areas, UI screenshots, and icon spritesheets often compress 30–45% smaller.

When to Use Lossless #

Lossless WebP shines whenever pixel accuracy is a hard requirement:

UI Assets & Design Exports #

Interface components, buttons, and design system exports must be pixel-perfect across every display. WebP lossless delivers the same fidelity as PNG at a smaller transfer size.

Logos & Wordmarks #

Logos contain sharp vector-derived edges and flat brand colours that lossy compression would visibly damage. Always use lossless for logos at any size.

Icons & Illustrations #

Flat-colour icons and illustrations have large uniform regions that VP8L’s LZ77 backwards references compress extremely efficiently. Expect above-average file-size reductions.

Screenshots & Diagrams #

Screen captures and technical diagrams contain precise text rendering and fine pixel-level detail. A single round of lossy compression would blur text and introduce artefacts around UI chrome.

Near-Lossless Mode #

WebP also offers a near-lossless pre-processing mode via the -near_lossless flag. Before encoding, the encoder applies a controlled amount of spatial smoothing that reduces pixel-level noise while keeping the image visually indistinguishable from the original. The output is then encoded losslessly, so the file is still a valid lossless WebP — but smaller than strict lossless because the pre-processing removed entropy that would otherwise have been preserved.

The -near_lossless value runs from 0 to 100, where:

• 0 applies maximum pre-processing (smallest file, most smoothing)
• 100 disables pre-processing entirely (equivalent to strict lossless)
• 60 is a good starting point that reduces file size noticeably without introducing visible changes

Try near-lossless at value 60 on screenshots and UI exports. Zoom in to 400% and compare with the original — if you cannot spot any difference, keep the setting. You will typically see an additional 5–15% size reduction over strict lossless.

Converting Images with cwebp #

# Lossless conversion from PNG
cwebp -lossless input.png -o output.webp

# Near-lossless (0=maximum pre-processing, 100=off)
cwebp -near_lossless 60 input.png -o output.webp

# Lossless with maximum compression effort (slower)
cwebp -lossless -m 6 input.png -o output.webp

The -m flag controls the compression effort on a 0–6 scale. Higher values (-m 6) instruct the encoder to try more internal compression strategies and select the smallest result, at the cost of significantly longer encode times. Use -m 6 in automated build pipelines where encode time is not a concern; use the default (-m 4) for interactive workflows.

Lossless WebP is not appropriate for photographs. Photographic images contain so much high-frequency detail that lossless encoding produces files as large as — or larger than — a well-tuned JPEG. Use lossy WebP for all photographic content and reserve lossless mode for graphics, UI assets, and images where pixel accuracy is a hard requirement.

To convert your graphics and UI assets to lossless WebP without the command line, our free browser-based WebP converter runs entirely in your browser and preserves alpha transparency automatically.