【前端】js方法 hex转rgba

【前端】js方法 hex转rgba

//hex转rgba

javascript 复制代码
 //hex转rgba
const hex2Rgba = (bgColor, alpha = 1) => {
  let color = bgColor.slice(1); // 去掉'#'号
  let rgba = [
    parseInt("0x" + color.slice(0, 2)),
    parseInt("0x" + color.slice(2, 4)),
    parseInt("0x" + color.slice(4, 6)),
    alpha
  ];
  return "rgba(" + rgba.toString() + ")";
};


//用法

hex2Rgba('#ffffff', 1)
//'rgba(255,255,255,1)'
javascript 复制代码
来自u-charts.js
// hex 转 rgba
function hexToRgb(hexValue, opc) {
  var rgx = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
  var hex = hexValue.replace(rgx, function(m, r, g, b) {
    return r + r + g + g + b + b;
  });
  var rgb = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
  if(!rgb){
	  return hexValue;
  }
  var r = parseInt(rgb[1], 16);
  var g = parseInt(rgb[2], 16);
  var b = parseInt(rgb[3], 16);
  return 'rgba(' + r + ',' + g + ',' + b + ',' + opc + ')';
}

十进制转hex

javascript 复制代码
const getred = (color) => {
    const red = (color & 0xff0000) >> 16;
    return red;
};
 
const getgreen = (color) => {
    const green = (color & 0x00ff00) >> 8;
    return green;
};
 
const getblue = (color) => {
    const blue = color & 0x0000ff;
    return blue;
};
 
// 十进制转hex
const Rgb2Hex = (color) => {=
    const r = getred(color);
    const g = getgreen(color);
    const b = getblue(color);
    const hex = "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
    return hex;
}
相关推荐
剑亦未配妥43 分钟前
移动端触摸事件与鼠标事件的触发机制详解
前端·javascript
路由侠内网穿透43 分钟前
本地部署 GPS 跟踪系统 Traccar 并实现外部访问
运维·服务器·网络·windows·tcp/ip
长河2 小时前
Java开发者LLM实战——LangChain4j最新版教学知识库实战
java·开发语言
Cyan_RA92 小时前
SpringMVC @RequestMapping的使用演示和细节 详解
java·开发语言·后端·spring·mvc·ssm·springmvc
ZERO_pan4 小时前
服务器装机遇到的问题
运维·服务器
l1t4 小时前
利用DeepSeek实现服务器客户端模式的DuckDB原型
服务器·c语言·数据库·人工智能·postgresql·协议·duckdb
杀气丶4 小时前
Linux下运行芙蕾雅天堂2【俄文简译L2FATER】
运维·服务器·天堂2·l2fater·l2fater.cn
喵手4 小时前
玩转Java网络编程:基于Socket的服务器和客户端开发!
java·服务器·网络
再见晴天*_*5 小时前
SpringBoot 中单独一个类中运行main方法报错:找不到或无法加载主类
java·开发语言·intellij idea
人工智能训练师7 小时前
Ubuntu22.04如何安装新版本的Node.js和npm
linux·运维·前端·人工智能·ubuntu·npm·node.js