将16进制的颜色转为rgb颜色

心已赠人 2022-09-15 12:42 294阅读 0赞

![02a0832ab28dde1d9bc8a523d356ba1b.png][]

考虑到通用性， 就定义一个colorToRGB函数吧，将16进制的颜色值当做参数传入。

首先需要将参数转为字符串类型的，'color = ""+color;'

检查第一个字符是否为"\#"， 如果第一个字符为“\#”，截取“\#”之后的字符，判断当前color的位数，需要考虑到色值是可以简写为3位的，如果是3位颜色值，每一位重复一次代表一个颜色，例如\#fff，其实是\#ffffff的简写，然后分别取得rgb三个色值：color1, color2, color3。

到这一步之后，就没什么了，剩下的就是拼接rgb色值了。

//16进制转RGB
    
      const colorToRGB = (color, opt) => {
        let color1, color2, color3;
        color = '' + color;
        if (typeof color !== 'string') return;
        if (color.charAt(0) == '#') {
          color = color.substring(1);
        }
        if (color.length == 3) {
          color = color[0] + color[0] + color[1] + color[1] + color[2] + color[2];
        }
        if (/^[0-9a-fA-F]{6}$/.test(color)) {
          color1 = parseInt(color.substr(0, 2), 16);
          color2 = parseInt(color.substr(2, 2), 16);
          color3 = parseInt(color.substr(4, 2), 16);
          return 'rgb(' + color1 + ',' + color2 + ',' + color3 + ',' + opt + ')';
        }
      };
    
    
     //调用
    
     colorToRGB(#fff,0.5);

[02a0832ab28dde1d9bc8a523d356ba1b.png]: /images/20220828/8738d651ba0a42c8acd19ec13efb82c1.png

发表评论取消回复

表情：

评论列表（有 0 条评论，294人围观）

还没有评论，来说两句吧...

相关阅读

相关颜色透明度16进制对照表

颜色透明度16进制对照表推荐这篇文章:[https://blog.csdn.net/sky1203850702/article/details/44916819][ht

比眉伴天荒/ 2023年10月05日 11:31/ 0 赞/ 59 阅读

相关 html十六进制颜色转换工具,16进制颜色(html颜色值)字符串转为UIColor

互联网 App 中经常会用到 html 颜色值转换 UIColor，比如：\FF9900、0XFF9900 等颜色字符串，以下方法可以将这些字符串转换为 UIColor 对象。

喜欢ヅ旅行/ 2022年10月05日 15:54/ 0 赞/ 886 阅读

相关将16进制的颜色转为rgb颜色

![02a0832ab28dde1d9bc8a523d356ba1b.png][] 考虑到通用性，就定义一个colorToRGB函数吧，将16进制的颜色值当做参数传入。

心已赠人/ 2022年09月15日 12:42/ 0 赞/ 295 阅读

相关 JavaScript RGB颜色与hex16进制转换

以QQ截图取色为例。取到RGB值 `181,224,255` ![在这里插入图片描述][9bd3b242195c43b9ac785c90381de096.png]

灰太狼/ 2022年09月12日 09:00/ 0 赞/ 179 阅读

相关 16进制颜色

16进制颜色原文连接： [https://www.cnblogs.com/summary-2017/p/7504126.html][https_www.cnblogs

电玩女神/ 2022年05月20日 05:06/ 0 赞/ 237 阅读

相关 OC - 16进制颜色码（#FFFFFF）转RGB

•定义宏>> 16的意思是把16进制转换成2进制后，右移16位（移动掉的直接舍弃） > \define UIColorFromRGBA（RGBValue，alphaValue

客官°小女子只卖身不卖艺/ 2022年05月15日 20:40/ 0 赞/ 299 阅读

相关 C++ 颜色RGB值转换为16进制

include <sstream> / Transform RGB value to hex. / std::stri

川长思鸟来/ 2022年02月23日 15:34/ 0 赞/ 498 阅读

相关 16进制颜色码对照表

常用十六进制颜色对照表代码查询颜色代码表：以下样色显示您可能觉得不够精确，这和电脑显示器有直接关系。您可查看颜色代码，绝对正确，绝无重复。 <table>

Dear 丶/ 2022年02月20日 09:28/ 0 赞/ 2372 阅读

相关【图片】Python对RGB颜色与16进制颜色进行互转

RGB颜色被称为“真彩色”，是Photoshop中默认使用的颜色，也是最常用的一种颜色模式。RGB模式的图像由3个颜色通道组成，分别为红色通道（Red）、绿色通道（Green）

拼搏现实的明天。/ 2022年01月12日 10:01/ 0 赞/ 845 阅读

相关 JavaScript实现rgb转为16进制

代码块 function RGBToHex(rgb){ var regexp = /[0-9]{0,3}/g; var re =

太过爱你忘了你带给我的痛/ 2021年09月14日 04:20/ 0 赞/ 272 阅读