How is this different from the binary JPG creator?

The binary JPG creator uses a fixed, repeating 4x4 Bayer matrix with no error propagation between pixels. This tool instead uses Floyd-Steinberg error diffusion, where each pixel's rounding error is actively carried forward into its neighbors, producing a texture that adapts more closely to local image detail.

What does the 'levels' setting control?

It's how many evenly-spaced steps each RGB channel gets quantized down to. At 2 levels, each channel collapses to fully on or off (producing a stark, colorful stippled look); higher levels keep more of the original color range while still reducing banding.

Does this only work in black and white?

No. Unlike the black-and-white and binary JPG creators, this tool dithers each RGB channel independently, so at levels above 2 it keeps a reduced but still colorful palette rather than pure black and white.

Why would I want fewer colors instead of the original smooth gradient?

Reducing levels intentionally trades smooth color gradients for a textured dot pattern, which is a deliberate retro/8-bit aesthetic used in pixel art, older game graphics, and print processes with a limited color palette.

Dithered JPG Creator - Floyd-Steinberg Error-Diffusion Photo Effect Online

Overview

Introduction

This tool applies Floyd-Steinberg error-diffusion dithering to a JPG entirely client-side.

It reduces each color channel to a small number of levels while spreading the resulting rounding error into neighboring pixels, producing a textured look instead of flat color banding.

What Is Dithered JPG Creator?

A client-side dithering tool that reads an uploaded photo's pixel data, quantizes each RGB channel independently down to an adjustable number of evenly-spaced levels, and diffuses the quantization error forward using the classic Floyd-Steinberg kernel.

Because the error is carried into the right, bottom-left, bottom, and bottom-right neighbors (weighted 7/16, 3/16, 5/16, 1/16), the overall image still reads as a smooth gradient from a normal viewing distance, even though each pixel only has a handful of possible values.

How Dithered JPG Creator Works

For each pixel, every RGB channel value is rounded to the nearest of `levels` evenly-spaced steps between 0 and 255; the difference between the original and rounded value (the 'error') is then added, weighted, into the not-yet-processed neighboring pixels.

Because errors accumulate and get corrected forward across the image, regions that would otherwise band into flat color blocks instead render as a fine, textured pattern of dots that the eye blends back into an apparent smooth gradient.

When To Use Dithered JPG Creator

Use it to create a retro, print-poster, or newspaper-halftone-style visual effect, prepare an image for output on a limited-color-palette device or medium, or add a deliberately textured, tactile look to a photo.

It's also a fun way to simulate the aesthetic of early digital or 8-bit-era color images.

Often used alongside Binary JPG Creator, Black and White JPG Creator and PNG Dithering Adder.

Features

Advantages

Runs entirely client-side; nothing is uploaded to a server.
Adjustable palette size from stark 2-level dithering up to subtle banding reduction.
Keeps color information (unlike the black-and-white-only tools), so results stay colorful at higher level counts.

Limitations

At very low levels, fine detail and smooth gradients are replaced with a visibly dotted texture.
Error diffusion is inherently sequential (each pixel affects later ones), so it's slightly more compute-intensive than a fixed-pattern ordered dither.

Examples

Stark 2-level colorful dither

Input

A 900x600 JPG, levels 2

Output

A high-contrast, stippled JPG where each channel is fully on or off

The lowest level count produces the most dramatic, colorful dithered texture.

Subtle banding reduction

Input

A smooth-gradient JPG, levels 8

Output

A JPG with far less visible color banding and only faint dot texture

Higher level counts stay close to the original look while still smoothing out banding.

Best Practices & Notes

Best Practices

Use levels 2-4 for a strong, deliberately retro dithered look.
Use levels 8-16 if your goal is simply reducing banding on a gradient-heavy photo without an obvious dithered texture.

Developer Notes

createDitheredJpg mirrors the Floyd-Steinberg error-diffusion kernel (7/16, 3/16, 5/16, 1/16) applied independently per RGB channel via a Float32Array working buffer, distinct from binaryJpgCreator's fixed 4x4 Bayer matrix (no error propagation) and blackAndWhiteJpgCreator's single flat threshold.

Dithered JPG Creator Use Cases

Creating a retro, halftone-print-style visual effect
Preparing an image for a limited-color-palette medium
Adding deliberate textured banding-reduction to a gradient-heavy photo

Common Mistakes

Setting levels very low and expecting fine detail to survive the quantization.
Confusing this tool's adaptive error diffusion with the binary JPG creator's fixed repeating pattern: they produce visibly different textures.

Tips

Try levels 2 alongside the black-and-white and binary JPG creators on the same photo to compare all three two-tone approaches side by side.
Combine with a mild blur beforehand if the dithered texture looks too noisy on a highly detailed source photo.

Dithered JPG Creator