What is colour banding?
Banding is the visible 'staircase' effect in what should be a smooth gradient. It happens when the display can't represent enough intermediate colours between two endpoints, so the gradient jumps in discrete steps instead of blending continuously. An 8-bit panel has 256 levels per channel (16.7 million total colours); 10-bit has 1024 levels per channel (1.07 billion). Banding is most visible in dark blue skies, sunset gradients, fog, and saturated red transitions — places where adjacent colour values are perceptually close.
8-bit vs 10-bit vs 6-bit + FRC — what's the difference?
True 10-bit panels show 1024 native levels per channel, with no banding visible in smooth gradients. 8-bit panels show 256 levels — fine for most content but with faint banding in dark blues and reds. 8-bit + FRC (Frame Rate Control) uses temporal dithering to fake 10-bit; it works well on fast panels. 6-bit + FRC fakes 8-bit and shows obvious staircases — common on cheap TN laptops. Check your panel spec sheet; words like 'supports 1.07B colours via FRC' mean 8-bit + dither, not native 10-bit.
Why does this test use Canvas instead of CSS gradients?
CSS gradients (linear-gradient, radial-gradient) are always interpolated at 8-bit per channel by the browser, regardless of your monitor or GPU. Even on a true 10-bit pipeline, a CSS gradient will show 8-bit banding. By writing raw RGB values directly to a Canvas2D ImageData buffer, this test bypasses CSS interpolation and sends true gradient data to your panel — so any banding you see is from the panel or driver, not the browser. For full 10-bit output your OS, GPU driver, and panel must all be in 10-bit mode.
How do I enable 10-bit colour output?
On Windows: NVIDIA Control Panel → Display → Change resolution → Output color depth: 10 bpc; or AMD Radeon Software → Display → Color Depth: 10 bpc. On macOS, 10-bit is automatic on supported displays since Mojave. You also need DisplayPort 1.2+ or HDMI 2.0+ cabling — at 4K 60 Hz, 10-bit requires DisplayPort 1.4 with DSC, or HDMI 2.1. Browsers (Chrome, Edge) need the '10-bit canvas' flag or HDR mode enabled. Without all three (OS, cable, app), the pipeline drops to 8-bit.
What's a good result on this test?
On a 10-bit panel with a 10-bit pipeline: all gradients look perfectly smooth, especially the black-to-white. On 8-bit + FRC: very faint banding in dark blue and saturated red, none in greyscale. On 8-bit native: clear faint banding in dark blues and reds. On 6-bit + FRC: visible staircase in greyscale and obvious banding in colour gradients. Fullscreen the test, dim the room, and view from normal distance — banding is a low-frequency artifact best seen with peripheral vision.
Does HDR help with banding?
Yes, but only if the source content is HDR. HDR formats (HDR10, Dolby Vision) require 10-bit or 12-bit panels and use a wider tonal range, so they inherently have finer gradient steps in dark tones than SDR 8-bit. However, enabling HDR mode on a low-end 8-bit panel often makes banding worse, because Windows now sends a wider tonal range through fewer levels. True HDR benefits need 10-bit native panels with at least 600 nits peak. For other panel checks see /monitor/uniformity, /monitor/gamma, and /monitor/dead-pixel.