Interactive Image Lab

Image Quantization Studio

Load an image, switch between RGB and true 1-channel grayscale processing, and quantize the result at 8, 4, 2, or 1-bit depth in real time.

Mode RGB

Bit Depth 8-bit

Colors / Channel 256

Source Sample image

Original Total Bits 13,086,720

Quantized Total Bits 3,271,680

Bit Difference 4x

Original Data Type Float32Array

Quantized Data Type Float32Array

Controls

Quantization is computed manually in JavaScript with canvas pixel data.

Drop in a new image PNG, JPEG, GIF, BMP, or WebP

Color mode

RGB Gray 1-channel

Bit depth 8-bit

1-bit 2-bit 4-bit 8-bit

Mapping Logic

Level index = round(pixel × (2^b - 1) / 255)

Quantized value = round(level index × 255 / (2^b - 1))

RGB mode quantizes each R, G, and B channel separately.

Live Comparison

The original stays unchanged while the quantized canvas updates instantly.

Original Display

Uint8 View

Float32 Source

Float32 View

Quantized Output

RGB · 8-bit

All Variants

Each preview is regenerated from the original image data so you can compare the full range.

8-bit

256 levels

4-bit

16 levels

2-bit

4 levels

1-bit

2 levels