Methodology
Color difference scores help compare two color values, deduplicate extracted palettes, and evaluate whether simulated or processed colors remain distinct. They are not accessibility scores.
Hue Codex calculates Delta E 76 as Euclidean distance in CIE Lab and OKLab distance as Euclidean distance in OKLab scaled for readability. These scores are useful signals, not universal human perception guarantees.
These badges identify which parts of this methodology are standards-backed, draft-track, Hue Codex-specific, approximate, or dependent on browser behavior.
This separates standards-based formulas from Hue Codex implementation decisions, product heuristics, and known limitations for this methodology.
Formula, threshold, syntax, or data behavior taken from a cited standard or standards-backed source.
How Hue Codex chooses to parse, normalize, round, export, or sequence calculations.
Product rankings, bands, labels, suggestions, or role hints that are useful guidance but not external standards.
Caveats, edge cases, browser dependencies, approximations, or contexts the method does not prove.
Hue Codex normalizes both colors to sRGB HEX, converts them to Lab and OKLab, then compares component differences. The same conversion engine used by color conversion tools is used here.
The comparison is symmetric: color A compared to color B produces the same distance as color B compared to color A.
Delta E 76 is the Euclidean distance between Lab coordinates: the square root of the sum of squared differences in L, a, and b.
OKLab distance uses the same Euclidean idea on OKLab components and scales the result by 100 to make values easier to read next to Delta E bands.
| Delta E 76 range | Label |
|---|---|
| 0 to 1 | Practically identical |
| Greater than 1 to 2.3 | Tiny visible shift |
| Greater than 2.3 to 10 | Close visible variant |
| Greater than 10 to 20 | Clearly different |
| Greater than 20 to 35 | Distinct palette color |
| Greater than 35 | Strongly separated |
| Check | Expected behavior |
|---|---|
| Same HEX compared with itself | Zero distance |
| A compared with B and B compared with A | Same distance |
| Near duplicate extracted swatches | Ranked as close before more distinct palette colors |
| Contrast compared with Delta E | Reported separately because they measure different things |
The formulas are standards-based or standards-derived color-space math. The interpretation bands remain Hue Codex heuristics.
delta_e_76(hex_a, hex_b):
lab_a = rgb_to_lab(hex_to_rgb(hex_a))
lab_b = rgb_to_lab(hex_to_rgb(hex_b))
dL = lab_a.L - lab_b.L
da = lab_a.a - lab_b.a
db = lab_a.b - lab_b.b
return sqrt(dL*dL + da*da + db*db)
oklab_distance_x100(hex_a, hex_b):
ok_a = rgb_to_oklab(hex_to_rgb(hex_a))
ok_b = rgb_to_oklab(hex_to_rgb(hex_b))
dL = ok_a.L - ok_b.L
da = ok_a.a - ok_b.a
db = ok_a.b - ok_b.b
return sqrt(dL*dL + da*da + db*db) * 100
comparison rule:
report Delta E, OKLab distance, hue shift, lightness shift, and WCAG contrast separatelyThese vectors validate Delta E 76, the scaled OKLab distance, and the separation between color difference and WCAG contrast.
| Input | Expected output | Notes |
|---|---|---|
| #000000 vs #000000 | Delta E 76 = 0; OKLab distance x100 = 0; contrast = 1 | Identical colors |
| #000000 vs #FFFFFF | Delta E 76 = 100; OKLab distance x100 = 100.00000000000003; contrast = 21 | Floating point output may display OKLab distance as 100 after rounding |
| #4169E1 vs #426AE2 | Delta E 76 = 0.40135924369994574; OKLab distance x100 = 0.31669742682101304; contrast = 1.013575785094293 | Near-duplicate vector |
| #FF0000 vs #00FF00 | Delta E 76 = 163.9260164011685; OKLab distance x100 = 51.98129015519161; contrast = 2.9139375476009137 | Large color difference does not imply passing text contrast |
These references anchor the public standards and formats used by Hue Codex. Status badges distinguish stable standards, drafts, Hue Codex heuristics, approximations, and browser-dependent behavior.
These Hue Codex tools link to this methodology because they depend on the formulas, assumptions, limits, or data policy described here.