Разница в шестнадцатеричном коде

Question

Возможно ли вычислить разницу между двумя шестнадцатеричными кодами? Я искал часы, и я начинаю думать, что это невозможно.

Пример: Color # 1: #c60f13 Color # 2: #970b0e Разница: 25% Darker

Ах да, я наткнулся на калькулятор Javascript, но это не сработало.

Спасибо, ребята!

Answer 1

Разделите их на (3) 2-байтовые группы, выполните математику для каждой группы индивидуально и примените ее к цвету, который представляет группа (красный/зеленый/синий).

C6 - 97 = red diff 
0F - 0B = green diff 
13 - 03 = blue diff 

Answer 2

номера HEX и HEX RGB цвета не равны. Однако они оба числа, представление HEX значений RGB содержит 3 независимых компонента: красный, зеленый и синий, упакованные как 3x8bit компоненты, такие как #RRGGBB. Таким образом, мы можем хранить их как одно целое.

Прежде всего, необходимо распаковать отдельные компоненты, таким образом:

r = (HEX >> 16) & 0xFF 
g = (HEX >> 8) & 0xFF 
b = HEX  & 0xFF 

Теперь вы можете выполнять вычисления

_r = abs(r1 - r2) 
_g = abs(g1 - g2) 
_b = abs(b1 - b2) 

затем упакуйте их:

HEX = _r<<16 | _g<<8 | _b 

Answer 3

Вы можете просто вычесть их непосредственно как шестнадцатеричные значения.

0xc60f13 
- 0x970b0e 
---------- 
= 0x2F0405 

Если вы первый разделить их на группы, вы получите тот же результат:

c6 0f 13 
-97 -0b -0e 
------------- 
=2F =04 =05 

Таким образом, нет никакой необходимости, чтобы сделать это первым.

В JavaScript вы можете этот расчет, как это:

var val1 = 0xc60f13; 
var val2 = 0x970b0e; 
var diff = (val1 - val2) & 0xffffff; 

console.log(diff.toString(16)); 

Результат:

2f0405 

Answer 4

Я предполагаю, что вы хотите, результирующее значение цвета разницы. Кроме того, поскольку вы отметили это тегом less, я собираюсь предположить, что вы используете less css preprocessor, и если да, то у него уже есть функция для этого: difference(). Так что это просто так:

difference(#c60f13, #970b0e); 

Который производит это:

#2f0405