一.十六进制转RGBA
/** @param: hex { string} 例如:"#23ff45"* @param: opacity { string || number } 透明度* @return: { string } rgba格式*/function hexToRgba(hex, opacity) {return "rgba(" + parseInt("0x" + hex.slice(1, 3)) + "," + parseInt("0x" + hex.slice(3, 5)) + "," + parseInt("0x" + hex.slice(5, 7)) + "," + opacity + ")"}
二.RGBA转十六进制
方法1:这个好理解
const toHex = function(r, g, b) {const INT_HEX_MAP = {10: 'A', 11: 'B', 12: 'C', 13: 'D', 14: 'E', 15: 'F' };const hexOne = function(value) {value = Math.min(Math.round(value), 255);const high = Math.floor(value / 16);const low = value % 16;return '' + (INT_HEX_MAP[high] || high) + (INT_HEX_MAP[low] || low); // 转换核心};if (isNaN(r) || isNaN(g) || isNaN(b)) return '';return '#' + hexOne(r) + hexOne(g) + hexOne(b);};
方法2:核心规则不好理解
/** @param: color { string}* @return: { string } 十六进制*/function colorRGB2Hex(color) {var rgb = color.split(',')var r = parseInt(rgb[0].split('(')[1])var g = parseInt(rgb[1])var b = parseInt(rgb[2].split(')')[0])var hex = "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);return hex}var myHex = colorRGB2Hex('rgba(255,232,186,0.4)')console.log(myHex) // "#f5faf3"