如何将 RGB 格式的颜色转换为十六进制格式,反之亦然?
例如,转换'#0080C0'为(0, 128, 192).
'#0080C0'
(0, 128, 192)
注意 : 和 的两个版本都rgbToHex期望整数值r,g因此b如果您有非整数值,则需要进行自己的舍入。
rgbToHex
r
g
b
以下将对 RGB 到十六进制的转换执行并添加任何所需的零填充:
function componentToHex(c) { var hex = c.toString(16); return hex.length == 1 ? "0" + hex : hex; } function rgbToHex(r, g, b) { return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b); } alert(rgbToHex(0, 51, 255)); // #0033ff
换一种方式:
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; } alert(hexToRgb("#0033ff").g); // "51";
[最后,正如@casablanca的评论中rgbToHex()所讨论的那样,还有一个替代版本:
rgbToHex()
function rgbToHex(r, g, b) { return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1); } alert(rgbToHex(0, 51, 255)); // #0033ff
这是一个版本,hexToRgb()它也解析一个速记十六进制三元组,例如“#03F”:
hexToRgb()
function hexToRgb(hex) { // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF") var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i; hex = hex.replace(shorthandRegex, function(m, r, g, b) { return r + r + g + g + b + b; }); 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; } alert(hexToRgb("#0033ff").g); // "51"; alert(hexToRgb("#03f").g); // "51";