我有两种颜色：
#15293E
#012549
如何找到它们之间的颜色？有没有办法进行这种计算？
答案 0 :(得分：79)
正如Lister先生所说，用任何编程语言自动计算很容易：
编辑：正如我最初所说，实施并非“非常简单”。我花时间用几种语言编写代码on Programming-Idioms。
答案 1 :(得分：47)
我使用此网站为我执行此任务：ColorBlender。
中间颜色为#0B2744。
答案 2 :(得分：16)
答案 3 :(得分：9)
如果您需要一般性地执行此操作，并且期望中间颜色在更多情况下在视觉上准确（即，中点的视觉颜色和色调应“向人类观察者看起来正确”），那么如上所述可能想在计算中点之前从RGB转换为HSV或HSL，然后转换回来。这可能与直接平均RGB值有很大不同。
以下是我在简短搜索中找到的用于转换到/来自HSL的JavaScript代码，并且在简短的检查中似乎做了正确的事情：
只需将rgbToHsl函数应用于两个r，g，b颜色向量，对两个结果向量求平均值，然后将hslToRgb应用于该向量。 。
答案 4 :(得分：5)
function padToTwo(numberString) {
if (numberString.length < 2) {
numberString = '0' + numberString;
}
return numberString;
}
function hexAverage() {
var args = Array.prototype.slice.call(arguments);
return args.reduce(function (previousValue, currentValue) {
return currentValue
.replace(/^#/, '')
.match(/.{2}/g)
.map(function (value, index) {
return previousValue[index] + parseInt(value, 16);
});
}, [0, 0, 0])
.reduce(function (previousValue, currentValue) {
return previousValue + padToTwo(Math.floor(currentValue / args.length).toString(16));
}, '#');
}
console.log(hexAverage('#111111', '#333333')); // => #222222
console.log(hexAverage('#111111', '#222222')); // => #191919
console.log(hexAverage('#111111', '#222222', '#333333')); // => #222222
console.log(hexAverage('#000483', '#004B39')); // => #00275e
答案 5 :(得分：5)
像这样：
function colourGradientor(p, rgb_beginning, rgb_end){
var w = p * 2 - 1;
var w1 = (w + 1) / 2.0;
var w2 = 1 - w1;
var rgb = [parseInt(rgb_beginning[0] * w1 + rgb_end[0] * w2),
parseInt(rgb_beginning[1] * w1 + rgb_end[1] * w2),
parseInt(rgb_beginning[2] * w1 + rgb_end[2] * w2)];
return rgb;
};
其中p是0到1之间的值，指定颜色应该在渐变的距离，rgb_beginning是颜色，rgb_end是颜色。两者都是[r，g，b]数组，因此您必须先从十六进制转换。这是LESS混音功能的简化版本，我认为它来自SASS。对于海报p将是0.5
答案 6 :(得分：2)
我刚刚编写了一个计算两种颜色之间颜色的函数，所以这里有人需要它，我认为它很短且可读，它接受十六进制字符串中的两种颜色，以及两者之间计算的颜色数，返回十六进制字符串数组中的颜色
我从中获取了rgbToHex和hexToRgb函数 here
希望这有帮助！
function rgbToHex(r, g, b) {
return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
}
function hexToRgb(hex) {
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
return result
? {
r: parseInt(result[1], 16),
g: parseInt(result[2], 16),
b: parseInt(result[3], 16)
}
: null;
}
// returns an array of startColor, colors between according to steps, and endColor
function getRamp(startColor, endColor, steps) {
var ramp = [];
ramp.push(startColor);
var startColorRgb = hexToRgb(startColor);
var endColorRgb = hexToRgb(endColor);
var rInc = Math.round((endColorRgb.r - startColorRgb.r) / (steps+1));
var gInc = Math.round((endColorRgb.g - startColorRgb.g) / (steps+1));
var bInc = Math.round((endColorRgb.b - startColorRgb.b) / (steps+1));
for (var i = 0; i < steps; i++) {
startColorRgb.r += rInc;
startColorRgb.g += gInc;
startColorRgb.b += bInc;
ramp.push(rgbToHex(startColorRgb.r, startColorRgb.g, startColorRgb.b));
}
ramp.push(endColor);
return ramp;
}
答案 7 :(得分：1)
如果您愿意，可以使用Windows计算器自行完成。
示例：
或使用上面提到的ColorBlender;）
答案 8 :(得分：0)
我找到了一个执行此操作的npm模块：https://www.npmjs.com/package/color-between
以下是一些用法示例：
const colorBetween = require('color-between');
// rgb format
colorBetween('rgb(255, 255, 255)', 'rgb(0, 0, 0)', 0.5, 'rgb');
// output: 'rgb(128, 128, 128)'
// rgba format
colorBetween('rgba(255, 255, 255, .2)', 'rgba(0, 0, 0, .8)', 0.5, 'rgb');
// output: 'rgba(128, 128, 128, 0.5)
// hex format
colorBetween('#fff', '#000', 0.5, 'hex');
// output: '#808080'
// mixed format
colorBetween('#fff', 'rgb(0, 0, 0)', 0.5, 'hsl');
output: 'hsl(0, 0%, 50%)'
答案 9 :(得分：0)
这里我留下了我在打字稿应用程序中使用的代码
function mixHexColors(color1: string, color2: string) {
const valuesColor1 = color1.replace('#', '').match(/.{2}/g).map((value) =>
parseInt(value, 16)
)
const valuesColor2 = color2.replace('#', '').match(/.{2}/g).map((value) =>
parseInt(value, 16)
)
const mixedValues = valuesColor1.map((value, index) =>
((value + valuesColor2[index]) / 2).toString(16).padStart(2, '')
)
return `#${mixedValues.join('')}`
}
答案 10 :(得分：0)
这是一个 Python 版本。
# -*- coding: utf-8 -*-
"""jcolor_split.py splits 2 hex color values, HEX_COLOR_1 and HEX_COLOR_2,
printing the color halfway between the two colors
Usage: jcolor_split.py HEX_COLOR_1 HEX_COLOR_2
Example: ./jcolor_split.py 3E599C 2E4892
"""
import sys
def jcolor_split(hex_color_1, hex_color_2):
print()
print (hex_color_1)
r1s = hex_color_1[0:2]
g1s = hex_color_1[2:4]
b1s = hex_color_1[4:6]
print(r1s,g1s,b1s)
print()
print (hex_color_2)
r2s = hex_color_2[0:2]
g2s = hex_color_2[2:4]
b2s = hex_color_2[4:6]
print(r2s,g2s,b2s)
# convert rgb's to ints
r1 = int(r1s, 16); g1 = int(g1s, 16); b1 = int(b1s, 16);
r2 = int(r2s, 16); g2 = int(g2s, 16); b2 = int(b2s, 16);
print()
print(r1,g1,b1)
print(r2,g2,b2)
# get the average
ra = int(round(float(r1+r2)/2))
ga = int(round(float(g1+g2)/2))
ba = int(round(float(b1+b2)/2))
print()
print(format(ra, 'x')+ format(ga, 'x')+ format(ba, 'x') )
NUM_ARGS = 2
def main():
args = sys.argv[1:]
if len(args) != NUM_ARGS or "-h" in args or "--help" in args:
print (__doc__)
sys.exit(2)
jcolor_split(args[0], args[1])
if __name__ == '__main__':
main()
sample_run = '''
PS C:\1d\JoeCodeswellHomePage> ./jcolor_split.py 3E599C 2E4892
3E599C
3E 59 9C
2E4892
2E 48 92
62 89 156
46 72 146
365097
PS C:\1d\JoeCodeswellHomePage>
'''