首页 > 其他分享 >js实现颜色转换

js实现颜色转换

时间:2023-07-21 10:11:58浏览次数:28  
标签:const color hex js return rgba parseInt 颜色 转换

// hex转rgba第一种
const hex2Rgb = (hexValue, alpha = 1) => {
  const rgx = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
  const hex = hexValue.replace(rgx, (m, r, g, b) => r + r + g + g + b + b);
  const rgb = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
  if (!rgb) {
    return hexValue;
  }
  const r = parseInt(rgb[1], 16),
    g = parseInt(rgb[2], 16),
    b = parseInt(rgb[3], 16);
  return `rgba(${r},${g},${b},${alpha})`;
};
// 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() + ")";
};
//十进制转hex
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;
};
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;
}

参考:https://blog.csdn.net/a460550542/article/details/127685094

标签:const,color,hex,js,return,rgba,parseInt,颜色,转换
From: https://www.cnblogs.com/coolestcode/p/17570527.html

相关文章

  • C++的四种强制类型转换
    将类型名作为强制转换的语法是C语言保留下来的,C++有自己独有的类型转换,就是四种cast。它们都有着统一的语法,即xx_cast<typename>(expression),可以将expression转换成typename的类型。static_cast顾名思义,静态转换,通常用于内置类型的转换。但是不能用于不同类型的指针/引用之间......
  • 论文翻译: FREEVC:朝着高质量、无文本、单次转换声音的目标迈进
    原文:FREEVC:TOWARDSHIGH-QUALITYTEXT-FREEONE-SHOTVOICECONVERSION原文地址:https://ieeexplore.ieee.org/abstract/document/10095191 个人总结:1.提出mel谱缩放增强方法。2.基于VITS框架进行改进,BUT在对照实验中缺没有对比VITS3.引入WavLM模型提高VC模型对说话人内容......
  • 读取MySQL中JSON文本会乱序
    如何读取MySQL中的JSON文本并保持顺序当我们在MySQL数据库中存储JSON文本时,有时候我们可能希望能够读取到与存储时相同的顺序。然而,由于MySQL的JSON类型是无序的,存储和读取时会导致JSON文本的顺序丢失。在本文中,我将向你展示如何通过使用MySQL内置函数和一些额外的代码来解决这个......
  • 将其他sql语句转换为mysql
    将其他SQL语句转换为MySQL在日常的数据库开发中,我们经常会遇到需要将其他数据库系统的SQL语句转换为MySQL语句的情况。虽然大部分SQL语句在不同的数据库系统中都有相似的语法,但仍然存在一些差异和特定的函数或关键字。本文将简要介绍如何将其他数据库系统的SQL语句转换......
  • 油猴 js 脚本 引入 jquery
    油猴脚本中引入jQuery的步骤作为一名经验丰富的开发者,我将帮助你学习如何在油猴脚本中引入jQuery。下面是实现这一目标的步骤:步骤描述1下载并安装油猴扩展2创建油猴脚本3引入jQuery库4测试jQuery功能接下来,我将详细说明每个步骤需要执行的操作,......
  • SheetJS/js-xlsx修改表头json_to_sheet修改表头
    [SheetJS/js-xlsx修改表头json_to_sheet修改表头_Aqvdrt的博客-CSDN博客](https://blog.csdn.net/qq_37027371/article/details/106022855)看官方文档看到的,记录一下,帮大家踩坑。//待展示的数据,可能是从后台返回的json数据或者是自己定义的objectconstdata=[{S:1,h:2,......
  • pyinstaller使用-python项目转换成exe可执行文件
    http://blog.csdn.net/pipisorry/article/details/50620122Python不是每个人的计算机里面都有安装,当您写了一个好用的工具,需要一个standaloneexectuable环境的需求。并且用python写些脚本什么的,有时候脚本写完以后,每次运行都得在IDE打开在运行,很麻烦,所以经常将python编译成exe......
  • android 怎么更改progressbar 的颜色
    项目方案:AndroidProgressBar颜色更改简介ProgressBar是Android中常用的进度条控件,它可以用来展示任务的进度。然而,默认情况下,ProgressBar的颜色是系统主题颜色,可能与项目的设计风格不匹配。本文将介绍如何通过代码来更改ProgressBar的颜色,以满足项目的需求。实现步骤步骤1:创......
  • Transformer(转换器)
    SequenceToSequence(序列对序列)输入一个序列,输出一个序列输出序列的长度由机器自己决定,例如:语音辨识、机器翻译、语音翻译 SequenceToSequence一般分成两部分:Encoder:传入一个序列,由Encoder处理后传给DecoderDecoder:决定输出什么样的序列Encoder Encoder中分......
  • 数据类型转换
    数据类型转换低 ------------------------------------------------->高byte,short,char->int->long->float->doublepublicclasscase4{publicstaticvoidmain(String[]args){//byte,short,char-->int-->long-->float-->double......