JavaScript:使用color-convert实现颜色色值转换

news2025/2/7 3:06:41

color-convert支持如下颜色格式的转换:

rgb, hsl, hsv, hwb, cmyk, ansi, ansi16, hex

文档

  • https://www.npmjs.com/package/color-convert
  • https://github.com/Qix-/color-convert

安装

$ npm install color-convert

使用示例

import convert from 'color-convert';

// RGB to CMYK
console.log(convert.rgb.cmyk(167, 255, 4));     // [ 35, 0, 98, 0 ]

// RGB to HEX
console.log(convert.rgb.hex(123, 45, 67));      // '7B2D43'
console.log(convert.rgb.hex([123, 45, 67]));    // '7B2D43'

// HEX to RGB
console.log(convert.hex.rgb('7B2D43'));      // [ 123, 45, 67 ]
console.log(convert.hex.rgb('#7B2D43'));    // [ 123, 45, 67 ]

通过这个库,可以做颜色转换的线上工具,例如:

https://mouday.github.io/tools/pages/color-convert/index.html

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1598511.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

深入理解Mesh Shader优化原理

参照AMD官网文章和GDC中其分享内容https://gpuopen.com/learn/mesh_shaders/mesh_shaders-index/总结自用,大佬直接原文。 一、传统顶点着色器管线与Mesh 着色器对比 具体之前也研究过可参照:DX12_Mesh Shaders Render 这里主要针对之前忽略的一些知识…

[BT]BUUCTF刷题第17天(4.15)

第17天(共3题) Web [强网杯 2019]高明的黑客 .tar.gz 是 Linux 系统下的压缩包,访问即可下载 打开后有3000多个php文件,通过题解得知需要写Python脚本找出合适的GetShell文件(因为每个文件里都会通过system函数执行…

贵阳市人民政府副市长刘岚调研珈和科技

4月9日,贵阳市人民政府副市长、党组成员刘岚一行到珈和科技走访调研,珈和科技总经理冷伟热情接待了考察团,就企业算力需求与合作,特色产业园区建设,科技成果转化落地等方面进行深入交流。 贵阳市教育局局长李波&#…

Vmware 虚拟机自定义IP地址 - UbuntuServer2204

Vmware 虚拟机自定义IP地址 - UbuntuServer2204 设置网段 选择喜欢的网段, 例如: 166 自定义 IP地址 打开虚拟机, 输入命令查看网卡名 ip addr查看网卡配置文件 ls -al /etc/netplan/编辑网卡配置文件 sudo vim /etc/netplan/00-installe…

稀疏数组思想

稀疏数组的处理方法是: 1)记录数组一共有几行几列,有多少个不同的值 2)思想:把具有不同值的元素的行列及值记录在一个小规模的数组中,从而缩小程序的规模 例如下面原数组对应稀疏数组:

Git-常规用法-含解决分支版本冲突解决方法

目录 前置条件 已经创建了Gitee账号 创建一个远程仓库 Git的优点 版本控制 Git 下载 Git的使用 检查Git的是否安装成功 git的常用命令 常用流程 Git 分支 分支流程 Git 远程仓库 远程仓库流程 特殊 可能遇到的问题 前置条件 已经创建了Gitee账号 创建一个远程仓…

CTK插件框架学习-事件监听(07)

CTK插件框架学习-服务工厂(06)https://mp.csdn.net/mp_blog/creation/editor/137295686 一、简介 事件监听指当事件发生变化时所产生的通信,是动态的,对于已经发生过的事件无法监听 二、事件类型 1、框架事件 监听框架状态变化,因为监听…

【ARFoundation自学01】搭建AR框架,检测平面点击位置克隆物体

Unity开发ARFoundation相关应用首先安装ARFoundation包 然后设置XR 1.基础AR场景框架搭建 2.一个基本的点击克隆物体到识别的平面脚本 挂在XROrigin上 脚本AppController 脚本说明书 ## 业务逻辑 AppController 脚本旨在实现一个基本的 AR 应用程序功能:用户通过…

【24年物联网华为杯】赛题分析与初步计划

赛事介绍 官网链接:2024 年全国大学生物联网设计竞赛 (sjtu.edu.cn) 含金量:属于A类赛事 (注意:很多搜索结果的序号是按照选入时间排列的,与含金量无关,华为杯是23年选入的) Kimi Chat: 全国…

攻防世界09cookie

9-cookie Cookie是保存在客户端的纯文本文件。比如txt文件。所谓的客户端就是我们自己的本地电脑。当我们使用自己的电脑通过浏览器进行访问网页的时候,服务器就会生成一个证书并返回给我的浏览器并写入我们的本地电脑。这个证书就是cookie。一般来说cookie都是服务…

数字孪生技术在设备故障检测中的应用

数字孪生技术在设备故障检测中的应用主要体现在以下几个方面,数字孪生技术在设备故障检测中的应用展现了其在智能制造和工业互联网领域的重要价值,通过实时监测、故障预测、诊断分析和预测性维护等手段,显著提升了设备管理的智能化水平。北京…

CAN终端电阻

目录 概述终端电阻的作用提高抗干扰能力确保快速进入隐性状态提高信号质量 为什么选120Ω 概述 CAN总线终端电阻,顾名思义就是加在总线末端的电阻。此电阻虽小,但在CAN总线通信中却有十分重要的作用。 终端电阻的作用 CAN总线终端电阻的作用有两个&…

轻松上手MYSQL:MYSQL初识(下)

​🌈 个人主页:danci_ 🔥 系列专栏:《MYSQL入门》 💪🏻 制定明确可量化的目标,坚持默默的做事。 轻松上手MYSQL:从零开始构建你的数据库世界 🚀 🚀欢迎来到My…

office竟然可以直接PDF转Word?这个“锅”请wps来背!

WPS和Office都是非常出色的办公软件,它们都能够满足我们日常办公的需求。然而,作为一款国产办公软件,WPS在功能集成和操作上更加符合中国人的使用习惯,因此很多人选择使用WPS作为他们的办公软件,包括我自己。 然而&…

初识微服务:重塑软件开发的未来

引言 随着信息技术的飞速发展,软件系统的复杂性和规模不断攀升,传统的单体应用架构已经难以满足现代业务的灵活性和可扩展性需求。在这样的背景下,微服务架构应运而生,成为当前软件开发领域的一大热门话题。本文将深入探讨微服务架…

LeetCode 73.矩阵置零————2024 春招冲刺百题计划

给定一个 m x n 的矩阵,如果一个元素为 0 ,则将其所在行和列的所有元素都设为 0 。请使用 原地 算法。 输入:matrix [[1,1,1],[1,0,1],[1,1,1]] 输出:[[1,0,1],[0,0,0],[1,0,1]] 示例 2: 输入:matrix […

解决EasyPoi导入Excel获取不到第一列的问题

文章目录 1. 复现错误2. 分析错误2.1 导入的代码2.2 DictExcel实体类2.2 表头和标题 3. 解决问题 1. 复现错误 使用EasyPoi导入数据时,Excel表格如下图: 但在导入时,出现如下错误: name为英文名称,在第一列&#xff0c…

0-1 设计高质量数据可视化大屏

5 大指南塑造高阶可视化 可视化是个友好的媒介 理解数据是成为优秀媒介的关键 业务驱动下的设计策略 图扑设计的无限可能 创新思维让可视化更具价值 可视化是个友好的媒介 我们正处于一个数据泛滥的时代,随处可见数据的身影,更知其不可忽视的重要…

金三银四面试题(二十):单例模式知多少?

设计模式也是面试中的热门考题,基本这个部分都是问问你知不知道XXX设计模式,有什么用,优缺点,然后再现场手写一个demo。很多时候是和spring一起考的,问问你知不知道spring框架用了哪些设计模式。今天我们来先看看单例模…

免费SSL证书安全吗?和付费的有什么区别?

SSL(安全套接层)证书是一种数字证书,用于在Web服务器和浏览器之间建立加密链接,以保护在线交易的安全。这种技术可以防止数据被窃取或篡改,从而保护用户的隐私和安全。 免费SSL证书与付费SSL证书在安全性方面存在一定…