10

Does anyone know of a way of taking two hex colour values and returning some kind of index to say how similar the colours are? e.g two shades of yellow might return a higher index i.e they are more similar than say a grey and yellow?

(Im using javascript but guess something like this would be a language independent formula/algorithm)

2

2 Answers 2

28

Here could be an algorithm to start with:

const yellow1 = "FFFF99"; const yellow2 = "FFFF00"; const blue = "0000FF"; function hexColorDelta(hex1, hex2) { // get red/green/blue int values of hex1 var r1 = parseInt(hex1.substring(0, 2), 16); var g1 = parseInt(hex1.substring(2, 4), 16); var b1 = parseInt(hex1.substring(4, 6), 16); // get red/green/blue int values of hex2 var r2 = parseInt(hex2.substring(0, 2), 16); var g2 = parseInt(hex2.substring(2, 4), 16); var b2 = parseInt(hex2.substring(4, 6), 16); // calculate differences between reds, greens and blues var r = 255 - Math.abs(r1 - r2); var g = 255 - Math.abs(g1 - g2); var b = 255 - Math.abs(b1 - b2); // limit differences between 0 and 1 r /= 255; g /= 255; b /= 255; // 0 means opposite colors, 1 means same colors return (r + g + b) / 3; } console.log(hexColorDelta(yellow1, yellow2)); // 0.7999999999999999 console.log(hexColorDelta(yellow1, blue)); // 0.19999999999999998 

Sign up to request clarification or add additional context in comments.

Comments

0

I've been searching Pascal code for a solution.

I dropped the Pascal restriction and found this question.

The Red(), Green() and Blue() functions replace the "parseInt"s.

Result:=(R/255+G/255+B/255)/3 

replaced

r /= 255; g /= 255; b /= 255; return (r + g + b) / 3; 

Bazza

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.