https://github.com/sylvenas/color-transfer
HEX <-> RGB[A] <-> HSL[A] transfer.
https://github.com/sylvenas/color-transfer
Last synced: 2 months ago
JSON representation
HEX <-> RGB[A] <-> HSL[A] transfer.
- Host: GitHub
- URL: https://github.com/sylvenas/color-transfer
- Owner: Sylvenas
- License: mit
- Created: 2020-12-25T03:12:33.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2020-12-26T05:39:53.000Z (over 4 years ago)
- Last Synced: 2025-02-23T19:51:29.845Z (3 months ago)
- Language: HTML
- Size: 19.1 MB
- Stars: 3
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README-zh_CN.md
- License: LICENSE
Awesome Lists containing this project
README
# convert-color
[English](./README.md) | 简体中文
支持 `RGB[A]` , `#RGB` , `HSL[A]` 三种格式互转
`RGB[A]` 与 `HSL[A]` 支持 `逗号`，`百分号`，`/`，`空格` 等多种分隔符，格式较多，总计支持 **50** 种格式互转，支持转换如下：
## 使用方法
### install
``` sh
npm i color-transfer
```
### 使用
``` js
import { HEXToHSL, HEXToRGB, RGBToHEX, RGBToHSL, HSLToHEX, HSLToRGB } from 'color-transfer'
HEXToRGB('#f36') // => [255, 51, 102]
RGBToHSL('rgba(100% 0% 60% / 0.4)') // => [324, 100, 50, 0.4]
// ...
```
## HEX
### HEX to RGB[A]
* #rgb => rgb(r,g,b)
* #rgba => rgb(r,g,b,a)
* #rrggbb => rgb(r,g,b)
* #rrggbbaa => rgba(r,g,b,a)
### HEX to HSL[A]
* #rgb => hsl(h,s%,l%)
* #rgba => hsl(h,s%,l%,a)
* #rrggbb => hsl(h,s%,l%)
* #rrggbbaa => hsl(h,s%,l%,a)
## RGB[A]
### RGB[A] to HEX
* (r,g,b) => #rgb
* (r,g,b,a) => #rrggbbaa
* rgb(r,g,b) => #rgb
* rgba(r,g,b,a) => #rgba
* rgba(r g b) => #rgb
* rgba(r g b / a) => #rgba
* rgb(r%,g%,b%) => #rgb
* rgba(r%,g%,b%,a) => #rgba
* rgba(r%,g%,b%,%a) => #rgba
* rgb(r% g% b%) => #rgb
* rgba(r% g% b% / a%) => #rgba
### RGB[A] to HSL[A]
* (r,g,b) => hsl(h,s%,l%)
* (r,g,b,a) => hsl(h,s%,l%,a)
* rgb(r,g,b) => hsl(h,s%,l%)
* rgba(r,g,b,a) => hsl(h,s%,l%,a)
* rgba(r g b) => hsl(h,s%,l%)
* rgba(r g b / a) => hsl(h,s%,l%,a)
* rgb(r%,g%,b%) => hsl(h,s%,l%)
* rgb(r%,g%,b%,%a) => hsl(h,s%,l%,a)
* rgb(r% g% b%) => hsl(h,s%,l%)
* rgba(r% g% b% / a%) => hsl(h,s%,l%,a)
* rgb(r%,g%,b%,a) => hsl(h,s%,l%,a)
## HSL[A]
### HSL[A] to HEX
* (h,s%,l%) => #rgb
* (h,s%,l%,a) => #rgba
* hsl(h,s%,l%) => #rgb
* (h,s%,l%,a) => #rgba
* hsl(h s% l%) => #rgb
* hsl(hdeg,s%,l%) => #rgb
* hsl(hrad,s%,l%) => #rgb
* hsl(hturn,s%,l%) => #rgb
* hsla(h s% l% / a) => #rgba
* hsla(h s% l% / a%) => #rgba
### HSL[A] to RGB[A]
* (h,s,l) => rgb(r,g,b)
* (h,s,l,a) => rgb(r,g,b,a)
* hsl(h,s,l) => rgb(r,g,b)
* (h,s,l,a) => rgb(r,g,b,a)
* hsl(h s l) => rgb(r,g,b)
* hsl(hdeg,s,l) => rgb(r,g,b)
* hsl(hrad,s,l) => rgb(r,g,b)
* hsl(hturn,s,l) => rgb(r,g,b)
* hsla(h s l / a) => rgb(r,g,b,a)rgb(r,g,b,a)
* hsla(h s l / a%) => rgb(r,g,b,a)
### 开发与测试
* 📦 打包
```
npm i
npm run build
```
* 单元测试
```
npm run test
```
## 单元测试
50种类型转换全部经过单元测试，单元测试代码覆盖率**100%**
## TODO
- 添加正则表达式校验输入合法