Color Distance (ΔE)
ΔE (Delta E) is the standard way to put a single number on "how different do these two colours look to a human eye". CIEDE2000 is the modern reference — values under ~1 are usually indistinguishable, under ~2 are very close, around 10 is clearly different, and 50+ is opposite-corner-of-the-wheel. CIE76 is shown for legacy use; RGB distance is included as a naive baseline.
- ΔE 200031.36
- ΔE 7667.18
- RGB distance85.15
Perception
Different — distinct colours.
ΔE is computed in CIE Lab using D65 reference white — same convention every modern colour-management tool uses.
How to use
- Type two HEX colours or pick them with the swatches.
- Read CIEDE2000 — that's the perceptual number to trust.
- The bottom note maps the value to a qualitative description.
Frequently asked questions
- Why is ΔE76 different from ΔE2000?
- ΔE76 is a straight Euclidean distance in Lab space — easy to compute but distorts in the blue region. CIEDE2000 corrects for hue, chroma, and lightness sensitivity differences. Modern colour-management software (Pantone, X-Rite, Adobe) reports CIEDE2000.
- What's the just-noticeable difference?
- Around ΔE 1 under controlled viewing conditions. In practice — bad monitors, ambient light, side-by-side vs. memory comparison — visitors usually start noticing at ΔE 2–3.
- Which formula should I quote in a specification?
- CIEDE2000, unless a standard or an existing process ties you to something else. It corrects the places where the 1976 formula misjudges difference — most visibly in blues and in highly saturated colours — and modern tolerance figures assume it. Whichever you use, write the formula next to the number: a tolerance of 2 does not mean the same thing under both.
- Does a large ΔE mean the text will be readable?
- No — these measure different things. Readability depends on contrast, which compares relative luminance, while ΔE measures perceived colour difference. Two colours can differ strongly in hue and still fail a contrast requirement because they are equally bright. Use a contrast checker for legibility and ΔE for matching a colour.
Related tools
OKLCH Color Picker
Pick colours in the perceptually uniform OKLCH space (lightness · chroma · hue) — and see whether each pick fits inside the sRGB display gamut.
CSS color-mix() Preview (Interpolation Space Comparison)
Compare how the modern CSS color-mix() function blends two colors in different interpolation spaces (srgb, hsl, oklch, lab, lch, hwb, oklab, srgb-linear) — live swatches, computed hex, full gradient strip per space, and copyable CSS for each.
Color Name Finder
Find the closest CSS, Tailwind, or XKCD-survey color name for any hex/RGB input — ranked by perceptual distance in OKLab color space.
CSS Blend Modes Simulator
Apply all 16 W3C compositing blend modes (multiply, screen, overlay, soft-light, hue, color, luminosity…) to two colors and see the computed hex result for each, with a copyable mix-blend-mode CSS snippet per mode.
Color Brightness Compare (HSL vs Lab L* vs WCAG vs HSP)
Compare seven different brightness metrics — HSL Lightness, HSV Value, WCAG Relative Luminance / LRV, CIE Lab L* perceived lightness, Rec. 709 Luma, HSP Perceived Brightness, and naïve (R+G+B)/3 — for one or two colors side by side, with deltas to show why a 'lighter' color can actually feel darker.
Color Contrast Checker
Check text/background contrast against WCAG AA and AAA levels.