Comparing and morphing palettes

ΔE: how different are two colors, really?

Two HEX values can differ numerically and still look identical — or differ by one digit and flip a brand color. ΔE (CIEDE2000) measures perceived difference: below 1, no human can tell the colors apart; 2–3 is just noticeable side by side; above 10 they read as different colors. Palette diff scores every slot of palette A against palette B so you can see whether a rebrand actually moved, and where.

Morphing: the path between two palettes

Morphing pairs each slot of palette A with palette B and interpolates in OKLCH along the shortest hue path. That matters during migrations: the midpoint frames are the intermediate themes your users would see if you animated a theme switch, and they are also candidate palettes in their own right — a 40% morph often lands on a softer variant worth keeping. Scrub or play the animation, then export the frame that works as tokens.

Because interpolation happens in OKLCH, lightness stays perceptually even during the morph; in RGB the same transition dips through grey. If a slot pair takes a strange route, the two hues are probably more than 180° apart in effect — swap in a closer intermediate from the picker and morph in two steps.

When to diff a palette

Before and after a redesign (did the palette actually change, or just the names?), when merging two products' design systems, when checking a contractor's delivery against the agreed palette, and when auditing whether a dark theme is a real palette or an inverted afterthought. For single colors rather than palettes, the color library lists nearest named neighbours, and pair-level accessibility belongs in the contrast checker.

Migrating tokens without surprising users

Ship large ΔE moves on brand accents first (users expect those to change), keep functional hues (success/warning/error) within a few ΔE of convention, and use morph midpoints as candidate soft launches. Export the chosen frame to CSS or Tailwind, then re-check body text pairs — a migration that looks fine as swatches can still fail AA on real type.

Load palettes quickly from Studio share links, Explore pages, or HEX lists. Index matching is best when both systems share role order; hue matching helps when one side was authored ad hoc. Compare fairly against tools that only show side-by-side swatches without ΔE — perception needs a number.

Related tools

Load palettes from Studio or Brand, refine outliers in the picker, then verify text pairs after a morph.

  • Studio
  • OKLCH picker
  • Brand from URL
  • Contrast checker
  • Explore palettes
Colorise ProOKLCH Engine
ExploreStudioNamesPickerPairs
ExploreStudioNamesPickerPairsContrastExtract
Menu

Product

  • Home
  • Explore
  • Studio
  • Color Names

Tools

  • Picker
  • Color Pairs
  • Contrast
  • Image Extract
  • Gradient Lab
  • Palette Diff
  • Brand from URL

Guides

  • All guides
  • OKLCH vs HSL
  • WCAG vs APCA
  • OKLCH color scales
  • Gamut & sRGB
  • Extract from images
  • HEX to OKLCH
  • Dark mode colors
  • Color meanings

Tools · Diff

Palette Diff & Morph

A = from · B = to · slider morphs the in-between in OKLCH. Export when it feels right.

Mean ΔE 30.6Biggest jump slot 3 · ΔE 56.34 pairs · OKLCH

A · from

Morph · 50%

B · to

Morph preview

Mid-migration UI

How the in-between palette reads on surface and type.

Accent action

Palette A

From

  • inkPick
  • primaryPick
  • accentPick
  • surfacePick

Palette B

To

  • inkPick
  • primaryPick
  • accentPick
  • surfacePick

Slot pairs · CIEDE2000 · tap for detail

Open morph in Studio

Frequently asked questions

What does the ΔE value mean?
ΔE (CIEDE2000) estimates perceived difference between two colors. Below 1 is indistinguishable, around 2–3 is just noticeable, and above 10 reads as a different color.
How does palette morphing work?
Each slot of palette A is paired with palette B and interpolated in OKLCH along the shortest hue path. Use Play to animate 0→100%, then export the mid-migration tokens.
Index vs hue matching?
By index pairs slot 1→1, 2→2. By hue reorders B so each A color meets its closest hue neighbor — useful when palettes were authored in different orders.
How do I load colors quickly?
Use Paste on either palette: drop a HEX list, a Studio share URL, or a ?colors= chain. Swap flips A and B when you want to reverse the migration.
What is a good ΔE between brand colors?
For a rebrand you usually want core colors to move by more than ΔE 5–10 so users register the change, while functional colors (success, warning, error) should stay within a few ΔE of their conventional hues so meaning is not lost.
Can I export the in-between palette from a morph?
Yes. Pause or scrub the morph to the frame you want and export it — the midpoint palettes are complete, usable themes, not just animation frames.
CIEDE2000 vs simple RGB distance?
RGB distance counts channel math, not perception — two greys can score high while a vivid hue shift scores low. CIEDE2000 (ΔE00) is the industry standard for perceptual difference and is what this tool reports.
How do I load Studio or Explore palettes into Diff?
Paste a HEX list, a Studio share URL, or a ?colors= chain into either side. Swap flips A and B when you want to reverse the migration direction.
Colorise Pro

Free OKLCH color workspace: precision color picker, color pairs, WCAG & APCA contrast checker, palette from image, Studio systems, names, gradients, and brand tools. Export HEX, CSS, Tailwind & DTCG.

OKLCH Engine

Product

  • Home
  • Explore
  • Studio
  • Color Names
  • Color Codes

Tools

  • Color Picker
  • Color Pairs
  • Contrast Checker
  • Image Extract
  • Gradient Lab
  • Palette Diff
  • Brand from URL
  • For presentations
  • For business cards
  • For SaaS landings
  • Duo pairs
  • Trio systems

Guides

  • All guides
  • OKLCH vs HSL
  • WCAG vs APCA
  • OKLCH color scales
  • Gamut & sRGB
  • Extract from images
  • HEX to OKLCH
  • Dark mode colors
  • Color meanings

Legal

  • Privacy
  • Terms

© 2026 Colorise Pro. All rights reserved.

© 2026 Colorise Pro. Hecho para el color con precisión.

Reportar infracción: [email protected] (Colorise Pro)

PrivacyTermsOKLCH · WCAG · APCA
Morph 50%