Why do the two distance numbers disagree?

RGB distance is raw channel arithmetic with no reference to human vision, while the OKLCH reading weights channels the way eyes do and folds lightness, chroma and hue together. The perceptual number is usually the meaningful one.

What ΔE counts as noticeable?

It depends on context and adjacency, but values under a few hundredths are generally indistinguishable, while anything approaching 0.1 in OKLCH terms is usually visible. The just noticeable difference calculator explores the boundary directly.

Can I compare a color against itself after export?

That is the classic use: set the original and the exported value, and the two numbers tell you whether the pipeline changed anything and whether it matters.

Does it tell me if the difference passes accessibility?

No — similarity and accessibility are different questions. The contrast checkers apply WCAG thresholds when you need a pass or fail verdict.

Which of the two numbers should I quote in a review?

The OKLCH-based ΔE, because it folds lightness, chroma and hue into one figure the way vision weights them. The RGB distance is useful as raw arithmetic separation, but a blue shift can score large while looking small.

Color Comparison Tool

Color A

Color B

Distance

RGB Euclidean

261

OKLCH ΔE (approx.)

0.349

You Might Also Need

Color Distance Calculator

Compute perceptual distance between two colors

Just Noticeable Difference Calculator

Compute perceptual JND between two colors

Palette Comparison

Compare two palettes side by side

Color Blend Tool

Blend two colors with adjustable ratio

The color comparison tool puts two colors side-by-side and measures how far apart they are, in plain RGB distance and in perceptual OKLCH terms.

What is Color Comparison Tool?

Two colors that look identical in one context can look obviously different in another, and eyeballing rarely settles the argument. The color comparison tool takes two values and answers the question three ways at once: the swatches sit literally side-by-side so your eye does the first pass, then the numbers quantify what the eye suspects. RGB Euclidean distance gives the straight arithmetic separation of the two values, and an OKLCH-based ΔE gives the perceptual reading — how different they look to a human, which is the number that actually matters when the question is will anyone notice.

The two numbers disagree, and that disagreement is the interesting part:

RGB Euclidean distance treats every channel equally, so a shift in blue can score the same as a shift in green while looking far smaller.
The OKLCH-based ΔE weights the channels the way vision does and folds lightness, chroma and hue into one figure, which is the number to cite when someone asks how different these two blues really are.
The swatches share an edge with no neutral between them, the one arrangement where the eye cannot smooth over a small gap.

As a hex comparison tool it earns its place in the dull but frequent disputes: did the export change the color, is this the same grey as last quarter's, are these two background tokens accidentally the same. Set both fields, read both numbers, and the discussion moves from opinion to measurement. When the verdict is too different, the mixers and shifters produce a value between the two; when the verdict is effectively the same, keeping the canonical one is a one-line cleanup.

Two colours are rarely compared for their own sake; they are compared because something depends on the answer. An accent against a surface, a hover state against a resting state, one brand asset against another: what matters is the size of the gap and its direction, and both are hard to judge by eye because the visual system adapts within seconds. Placing the swatches adjacent, sharing an edge with no neutral between them, exploits that adaptation deliberately — a direct join is the one place the eye cannot smooth over the difference, so a genuinely small gap becomes visible and a large one becomes obvious.

Reading the delta alongside the pair makes this a color difference checker rather than a swatch book: the fields give a number to attach to a review comment, and the side-by-side view gives the reviewer the same evidence the comment is built on, which is what makes the compare two colors side by side verdict stick. Numbers also survive hand-off, so a note that says the second grey is nearly indistinguishable from the first is checkable by whoever picks up the work.

What the tool deliberately does not do is guess intent:

It will not tell you whether a difference is acceptable — a 2:1 contrast change is nothing in a decorative border and a failure on body text.
No accessibility verdict: the contrast checkers apply WCAG thresholds when a pass or fail is needed.
No harmony judgement either — the harmony finders read relationships, and the mixers are what produce a value between the two colours.

How to use Color Comparison Tool

Set color A and color B with the two fields.
Compare visually with the side-by-side swatches, then read the two distance figures.
Use the RGB distance for raw separation and the OKLCH ΔE for how different it will look.

When to use Color Comparison Tool vs related tools

Use this when two specific values need a verdict — export checks, near-duplicate tokens, revision disputes. Use the contrast checkers when the question is accessibility rather than similarity, and the delta-E style readings here are also the basis of the just noticeable difference calculator for perception questions. The perceptual figure here is the same idea behind the just noticeable difference calculator, and for a pass or fail verdict the contrast checker applies WCAG thresholds.

Privacy & Security

This tool runs entirely in your browser — no data ever leaves your device. There is no server round-trip, no upload, no logging, and no account required. Your input is processed locally using client-side JavaScript and is never stored, transmitted, or accessible to anyone else. When you close the tab, everything disappears.