Optimizing Dithering GIF Images

01
of 05

Largest File - No Optimization

Largest File - No Optimization
Largest File - No Optimization. Courtesy J Kyrnin

Dithering in GIF images helps reduce banding in gradients of color, but it also vastly increases the file size. This gallery demonstrates how large the images can get with dithering and no dithering.

This is the file without any optimization. I saved it with 256 colors and no dither, and it's huge.

File size: 12.46KB
Base file size: 1.13KB

  • 256 colors
  • no dither
02
of 05

Base File - Best Optimization

Base File - Best Optimization
Base File - Best Optimization. Courtesy J Kyrnin

This is the file with the best optimization. It's also got really bad banding. You wouldn't want to use this as a gradient on your site, despite its size.

File size: 1.13KB

  • 8 colors
  • no dither
03
of 05

Diffusion Dither

Diffusion Dither
Diffusion Dither. Courtesy J Kyrnin

The diffusion dither gives some banding, but what's worse, the file size is nearly 4 times the optimized image.

File size: 4.13KB
Base file size: 1.13KB

  • 8 colors
  • 100% diffusion dither
04
of 05

Pattern Dither

Pattern Dither
Pattern Dither. Courtesy J Kyrnin

Pattern dither results in a smoother gradient, but the file size is more than double the optimized file.

File size: 2.75KB
Base file size: 1.13KB

  • 8 colors
  • pattern dither
05
of 05

Noise Dither

Noise Dither
Noise Dither. Courtesy J Kyrnin

This file is saved with a noise dither. The banding is reduced, but the gradient isn't as smooth.

File size: 5.60KB
Base file size: 1.13KB

  • 8 colors
  • noise dither