Which PNG settings should you change?

Want a smaller PNG that looks exactly the same? In FluffyBench, changing how the picture is packed can save more space than turning compression up.

What does a PNG setting change?

A PNG stores a picture as colored pixels. Think of a completed jigsaw: you can pack the same pieces into a smaller box, or replace them with a simpler picture. PNG compression does the packing; color choices can change the pieces. Start by changing how it’s packed before you simplify its colors.

Repacking keeps the colors you already have. A shorter palette gives the picture fewer shades to choose from.

Conceptual illustration: the top pair keeps every color; the bottom pair simplifies the shades.
Conceptual illustration: the top pair keeps every color; the bottom pair simplifies the shades. How we reviewed

Here, ‘unchanged’ means the saved picture comes back with the same pixels.

Start with FluffyBench’s advanced PNG encoder

In FluffyBench’s PNG converter, the PNG choices live in Settings, under More options. Advanced local encoder makes the color, depth, compression and interlace controls available.

More options panel with PNG encoding, color, sample depth, compression and interlace controls.

PNG settings

  1. PNG encoding

    Advanced local encoder exposes the choices below.

  2. PNG color

    Choose which colors and transparency to keep.

  3. PNG sample depth

    Choose the precision of each saved color value.

  4. PNG compression

    Choose how tightly to pack the pixels.

  5. PNG interlace

    Choose a rough-to-complete loading order.

The settings below explain when each choice helps; the complete walkthrough follows them.

Advanced local encoder made every picture we tried 10.3% to 58.3% smaller than Browser default, with unchanged pixels. We used a mountain photo, flat app-screen art, a transparent Earth graphic and a PNG saved with 16-bit color.

Same pixels in every bar: Advanced starts at RGBA, 8-bit, Balanced, interlace off. RGB saves a little more on the three pictures without transparency; each group has its own scale.
Same pixels in every bar: Advanced starts at RGBA, 8-bit, Balanced, interlace off. RGB saves a little more on the three pictures without transparency; each group has its own scale.

Which color choice fits your picture?

RGBA keeps red, green, blue and transparency. Indexed palette stores a short color list, and each pixel points to a color on that list. That can be a great fit for flat artwork whose colors already fit the list.

A flat app-screen graphic, like artwork you’d export for an interface, came back unchanged with Indexed palette in a smaller file than RGBA. The edges and colors still match the source.

Matched detail from the same interface graphic; sizes describe the complete files.
Matched detail from the same interface graphic; sizes describe the complete files.

A mountain photo has more shades than the short palette can keep unchanged: Indexed approximates them, while Grayscale removes the color. RGBA keeps the source picture’s pixels.

The enlarged sky detail makes the palette’s color steps easier to see; sizes describe the complete files.
The enlarged sky detail makes the palette’s color steps easier to see; sizes describe the complete files. · Photo: John Marino / NPS Photo, National Park Service, Public domain, via Wikimedia Commons.

The mountain source is already a JPG; why image files get larger explains why its PNG copy grows.

On a see-through Earth graphic, RGB (no alpha) and Grayscale (no alpha) fill transparent areas with white; Grayscale also removes color. Keep RGBA when see-through areas matter.

The framed panels share a checkerboard and dark backing; white fill covers that backing in both no-alpha outputs.
The framed panels share a checkerboard and dark backing; white fill covers that backing in both no-alpha outputs. · Photo: NASA, Public domain, NASA-created image, via Wikimedia Commons.

For pictures without transparency, RGB is the small extra saving in the encoder chart above. It doesn’t reduce the color palette.

Does stronger compression save much?

Compression repacks the picture without changing its pixels. Maximum made these files 2.3% to 7.5% smaller than Fast—a modest saving beside the color choices.

Bytes saved by Maximum compared with Fast

Photograph
2.4 %
Flat interface graphic
7.5 %
Picture with transparent areas
2.3 %
16-bit PNG
5.1 %
Same pixels at RGBA, 8-bit, interlace off; Balanced isn’t always smaller than Fast.

For the separate question of waiting time, see PNG compression: file size and timing.

Do bit depth and interlacing help?

Leave PNG sample depth at 8-bit for ordinary PNG input in FluffyBench. Even a PNG saved with 16-bit color is decoded to 8-bit first, so 16-bit output can't restore the finer color steps lost on input.

Simplified precision path. The 16-bit PNG grew from 6.6 KB at 8-bit output to 7.8 KB at 16-bit output, without adding finer color steps.
Simplified precision path. The 16-bit PNG grew from 6.6 KB at 8-bit output to 7.8 KB at 16-bit output, without adding finer color steps.

PNG interlace arranges the picture in rough-to-complete passes. Leave it off unless you need that kind of preview while a picture is arriving.

Conceptual loading sequence, not a timed capture; interlacing changes the loading order, not the finished picture.
Conceptual loading sequence, not a timed capture; interlacing changes the loading order, not the finished picture. · Photo: John Marino / NPS Photo, National Park Service, Public domain, via Wikimedia Commons.

Doing it in FluffyBench

This walkthrough uses flat art and Indexed palette; choose RGBA instead when you need the picture’s colors and transparency kept.

  1. PNG converter intake, PNG destination and Settings.
    PNG converter intake, PNG destination and Settings.
    Step 1. Choose images, leave To on PNG, then open Settings.
    1. Choose images opens your device’s file picker.
    2. PNG is already selected as the output.
    3. Open Settings to reach the PNG choices.
  2. More options with Advanced local encoder and Indexed palette selected.
    More options with Advanced local encoder and Indexed palette selected.
    Step 2. Open More options and choose Advanced local encoder. Use Indexed palette for this flat graphic and leave the other PNG choices as shown.
    1. More options reveals the PNG settings.
    2. Choose Advanced local encoder for these controls.
    3. Choose Indexed palette; leave 8-bit, Balanced and interlace off.
  3. Size with Original selected.
    Size with Original selected.
    Step 3. Keep Size on Original to compare settings at the same dimensions.
    1. Original keeps the picture’s pixel dimensions.
  4. Workspace header with the Settings toggle while the settings panel is open.
    Workspace header with the Settings toggle while the settings panel is open.
    Step 4. Use the gear button again to close Settings.
    1. Press the gear button again to close Settings.

With the settings chosen, you're ready to convert and save your PNG.

  1. Convert ready with the flat PNG selected.
    Convert ready with the flat PNG selected.
    Step 1. Press Convert 1 to PNG to create the copy.
    1. Convert makes a PNG with your chosen settings.
  2. Completed PNG tile with input and output dimensions and sizes.
    Completed PNG tile with input and output dimensions and sizes.
    Step 2. Compare the output size and dimensions with the input. Use the picture comparisons above to decide whether the color choice fits.
    1. The input’s dimensions and file size.
    2. The new PNG’s dimensions and file size.
  3. Download button for the completed PNG.
    Download button for the completed PNG.
    Step 3. Download saves the completed PNG to your device.
    1. Download saves the completed PNG to your device.

Need fewer pixels as well as fewer bytes? Resizing, compression and conversion explains which job to choose.

Try these choices on your own picture with FluffyBench’s PNG converter.

How we reviewed PNG settings

We compared 4 inputs at their original dimensions. These counts show pixels changed by each color choice at 8-bit and Balanced compression, with interlace off.

Color typePhotographFlat interface graphicPicture with transparent areas16-bit PNGIdentical to the source
RGBA0 of 2,448,0000 of 960,0000 of 311,9200 of 6,14448 of 48 outputs identical
RGB0 of 2,448,0000 of 960,00097,176 of 311,9200 of 6,14436 of 48 outputs identical
Grayscale2,420,875 of 2,448,000631,476 of 960,000310,499 of 311,9206,137 of 6,1440 of 48 outputs identical
Indexed2,446,615 of 2,448,0000 of 960,000231,211 of 311,9206,099 of 6,1446 of 24 outputs identical
The last column counts identical pictures across every tested setting for that color type.

RGBA stayed unchanged in all 48 outputs. Indexed did so in 6 of 24, all for the flat interface graphic. Grayscale changed every sample. The 6 16-bit Indexed combinations were skipped because that choice isn't offered.

Search FluffyBench