javascript - 十六进制代码差异

Question

是否可以计算两个十六进制代码之间的差异？我一直在寻找几个小时，我开始认为这是不可能的。

示例：颜色 #1：#c60f13 颜色 #2：#970b0e 差异：25% Darker

哦，是的，我遇到了一个 Javascript 计算器，但它不起作用。

多谢你们！

score 2 · Accepted Answer

将它们分成 (3) 个 2 字节组，分别对每个组进行数学运算并将其应用于组代表的颜色（红色/绿色/蓝色）。

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

score 1 · Accepted Answer

HEX 数字和 HEX RGB 颜色不相等。但是它们都是数字，RGB 值的 HEX 表示包含 3 个独立的组件：红色、绿色和蓝色，打包为 3x8 位组件，如#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

score 1 · Accepted Answer

我假设您想要差异的结果颜色值。另外，因为你用less标签标记了这个，我假设你正在使用less css preprocessor，如果是这样，它已经有一个功能：difference()。所以就是这样：

difference(#c60f13, #970b0e);

产生这个：

#2f0405

score 0 · Accepted Answer

您可以直接将它们作为十六进制值减去。

  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

4 回答 4