Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/lunatic-fox/kolorz
A Node.js library to convert colors into different color systems.
https://github.com/lunatic-fox/kolorz
color converter css hexadecimal-color hsl node-js nodejs npm npm-package rgb
Last synced: 19 days ago
JSON representation
A Node.js library to convert colors into different color systems.
- Host: GitHub
- URL: https://github.com/lunatic-fox/kolorz
- Owner: lunatic-fox
- License: mit
- Created: 2022-09-12T03:58:27.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2022-09-20T02:04:03.000Z (about 2 years ago)
- Last Synced: 2024-10-04T18:41:26.655Z (about 1 month ago)
- Topics: color, converter, css, hexadecimal-color, hsl, node-js, nodejs, npm, npm-package, rgb
- Language: JavaScript
- Homepage: https://www.npmjs.com/package/kolorz
- Size: 32.2 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Kolorz 
### A Node.js library to convert colors into different color systems.
### [Donations ❤](https://github.com/lunatic-fox/gh-tags/blob/main/docs/donation/README.md)
## Install
~~~
npm i kolorz
~~~
## Overview
Documentation is also provided in Typescript, so Intellisense will give you more information of how to use on VS Code.
### Kolorz
~~~typescript
kolorz
hex(color: string): toRGB | toHSL | ;
rgb(color: string): toHex | toHSL | ;
hsl(color: string): toRGB | toHex | ;
css(color: string): toRGB | toHSL | toHex | ;
hexa(color: string): toRGBA | toHSLA | & alpha();
rgba(color: string): toHEXA | toHSLA | & alpha();
hsla(color: string): toRGBA | toHEXA | & alpha();
~~~
The `color` parameter is a valid correspondent color pattern with some tolerances:
> `hex`
~~~javascript
'#DAD' // #DDAADD
'A1D' // #AA11DD
'#C00FEE' // #C00FEE
'F1A5C0' // #F1A5C0
~~~
> `hexa`
~~~javascript
'#FACE' // #FFAACCEE
'AC1D' // #AACC11DD
'#BA5EC0DE' // #BA5EC0DE
'BEAD5BED' // #BEAD5BED
~~~
> `rgb`
~~~javascript
'rgb(255, 30, 6)' // rgb(255, 30, 6)
'(255, 30, 6)' // rgb(255, 30, 6)
'255, 30, 6' // rgb(255, 30, 6)
'255,30,6' // rgb(255, 30, 6)
~~~
> `rgba`
~~~javascript
'rgba(255, 30, 6, .3)' // rgba(255, 30, 6, 0.3)
'(255, 30, 6, .3)' // rgba(255, 30, 6, 0.3)
'255, 30, 6, 1' // rgba(255, 30, 6, 1)
'255,30,6,.4' // rgba(255, 30, 6, 0.4)
~~~
> `hsl`
~~~javascript
'hsl(255, 30, 6)' // hsl(255, 30%, 6%)
'(315, 30, 6)' // hsl(315, 30%, 6%)
'25, 30, 6' // hsl(25, 30%, 6%)
'25,100,6' // hsl(25, 100%, 6%)
~~~
> `hsla`
~~~javascript
'hsla(255, 30, 6, .453)' // hsla(255, 30%, 6%, 0.453)
'(315, 30, 6, .453)' // hsla(315, 30%, 6%, 0.453)
'25, 30, 6, .453' // hsla(25, 30%, 6%, 0.453)
'25,100,6,.453' // hsla(25, 100%, 6%, 0.453)
~~~
### First layer properties
~~~typescript
toHex: string
toRGB: string
toHSL: string
toHexa: string
toRGBA: string
toHSLA: string
~~~
### HSL methods
#### Hue
Increase or decrease the hue value of the color pattern.
~~~typescript
hue(degree: number): | value
~~~
`degree` - A number between 0 and 360.
#### Saturation
Increase or decrease the saturation value of the color pattern.
~~~typescript
saturation(percentage: number): | value
~~~
`percentage` - A number between 0 and 1.
#### Lightness
Increase or decrease the lightness value of the color pattern.
~~~typescript
lightness(percentage: number): | value
~~~
`percentage` - A number between 0 and 1.
### Alpha
Increase or decrease the alpha value of the color pattern.
~~~typescript
alpha(percentage: number): | value
~~~
`percentage` - A number between 0 and 1.
### Value
Returns the color pattern string in the same color system.
~~~typescript
value: string
~~~
## Examples
#### Simple convertion
> Hexadecimal to RGB and HSL
~~~javascript
const kolorz = require('kolorz');
const color = '#28ee00';
console.log(kolorz.hex(color).toRGB);
// rgb(40, 238, 0)
console.log(kolorz.hex(color).toHSL);
// hsl(110, 100%, 47%)
~~~
> Hexadecimal-alpha to RGBA and HSLA
~~~javascript
const kolorz = require('kolorz');
const color = '#28ee0001';
console.log(kolorz.hexa(color).toRGBA);
// rgba(40, 238, 0, 0.004)
console.log(kolorz.hexa(color).toHSLA);
// hsla(110, 100%, 47%, 0.004)
~~~
#### Adjusting alpha
~~~javascript
console.log(kolorz.hexa(color).alpha(.5).toRGBA);
// rgba(40, 240, 0, 0.506)
console.log(kolorz.hexa(color).alpha(.5).toHSLA);
// hsla(110, 100%, 47%, 0.506)
~~~
#### HSL adjusting
>saturation
~~~javascript
const kolorz = require('kolorz');
const color = '#28ee00ff';
console.log(kolorz.hexa(color).saturation(.5).toRGBA);
// rgba(40, 240, 0, 1)
console.log(kolorz.hexa(color).saturation(.5).toHSLA);
// hsla(110, 100%, 47%, 1)
~~~
>lightness
~~~javascript
console.log(kolorz.hexa(color).lightness(.5).toRGBA);
// rgba(242, 255, 240, 1)
console.log(kolorz.hexa(color).lightness(.5).toHSLA);
// hsla(112, 100%, 97%, 1)
~~~
>hue
~~~javascript
console.log(kolorz.hexa(color).hue(120).toRGBA);
// rgba(0, 40, 240, 1)
console.log(kolorz.hexa(color).hue(120).toHSLA);
// hsla(230, 100%, 47%, 1)
~~~
Made with ❤️ by me.
**Josélio Júnior (Lunatic Fox) - 2022**