What is Dithering in Image Processing?

Learn how it applies to gradients of color

A comic-book style image that uses dithering.

Whether you’re a web designer, graphic artists, or even an electronic musician, dithering plays a vital role in the creative process. Dithering in image processing is a technique used to simulate colors or shading. The basic concept behind dithering is adding noise, or additional pixels, to a digital file. In graphics, dithering adds random patterns of pixels to improve the image quality while avoiding banding.

History of Dithering

Mostly forgotten, one of the earliest uses for dithering was in World War II for bomb trajectories and navigation. That use differs greatly from dithering as we know it today. Used commonly in the printing press for both newspapers and comic books, dithering came into its own with the advent of the World Wide Web. Before the internet had become the polished eye candy we know today, almost all sites were text-based. The snail-paced speeds of dial-up only allowed graphics to be downloaded at dreadfully slow speeds. However, when computing expanded into 8-bit color with monitors, graphics and dithering came to the forefront for the web. 

How Dithering Was Used in the Past

In its earlier uses in newspapers, comic books, and other printed media, dithering would be applied to images to create levels of simulated grayscale by strategic placement of black dots. Using the dithering process would give a smooth image with gray shades even though printing presses only supported black ink. Comic books and other color printing worked similarly, but to simulate more shades of color than the limited palette printing presses had. Below is a sample of how printing presses processed high-quality images into a dithered image. Notice how you can still see distinct colors and shading, but the image is much more pixelated.

A rat terrier image that has been turned into a comic.

More recently, dithering has become popular in web graphics. Even though most of the population has access to high-speed internet, there is still a modest percentage of internet users that are reliant upon dial-up. Using dithering in image processing not only reduces banding of colors and shading, which creates a smoother finished image, but it also reduces the file size. The first image is a banded image. You can clearly see the transitions in color.

Colors with a distinct banding in the image.

The second image is a smooth gradient where dithering has been applied. The banding is no longer visible and produces a much smoother image.

A smooth gradient image.

One of the key uses for dithering was to avoid banding in any color or shade gradient. By mixing shades from a limited palette to simulate the original color, you are reducing the file thus creating a file that can download faster onto your screen and\or computer. GIFs are an excellent example of dithering images. Smaller files require less bandwidth which allows for faster transmission. In the early days of the internet, dithering was a web designer’s best friend. They could create more visually appealing websites while being friendly to slower data connections.

Dithering in Printing

While the limitations of older 8-bit and 16-bit monitors are no longer a concern, and technology enhancements have far exceeded the necessity for dithering, it still has some popularity today. Many models of home printers use dithering. It is mainly to reduce the cost of operating the printer and keeping the cost of the printer itself down. Inkjet printers specifically spray microscopic dots on paper producing a variety of colors and shades. Even monochrome printers will translate a color photo into a dithered black image to produce a black and white replica of the image.

A large commercial inkjet printer printing comics.
 Juanjo Fernandez/Pixabay

Dithering in Photoshop

The other widespread use of dithering in image processing is artistic. Programs like Photoshop allow photographers and graphic artists to add exciting nuances to their images. By applying different Pattern Overlays to images, you can create some fun and unique images. You can even replace the colors for dithering by changing your palette in Color Fill. A typical application is to change a black and white photo into one that is aged with dithering and sepia tones as shown below:

A black and white image of a tabby cat.

Here is the original black and white photo. While a nice photo, by adding some textures and color fills, Photoshop can render this image into an artistically dithered image as seen below:

A tabby cat with sepia tones and dithering applied.

A Pattern Overlay of Pastel Paper with a Color Fill of a simulated sepia shade in Photoshop drastically changes the look of the photo.

In Photoshop, by applying the different Pattern Overlays, you can get a variety of artistic expressions. Dithering is not only a space saver but an adventurous way to express your inner Picasso.