Basic color library that provides all basic colors with 10 shades each. It also provide a color class that accept any color and allow you to change its lightness and darkeness then get the updated color in any format you want.
$ npm install @kreattix/colors
$ yarn add @kreattix/colors
import { Colors } from '@kreattix/colors'
...
...
const color = {
main: Colors.red[500],
hover: Colors.red[400],
active: Colors.red[600],
}
...
...
import { Color, Colors } from '@kreattix/colors'
...
...
const color = Color(Colors.blue[500]) // using color from library
// or
const color = Color('#465657') // using hex value
// or
const color = Color('#465657dd') // using hexa value
// or
const color = Color('rgb(10,30,50)') // using rgb value
// or
const color = Color('rgba(10,30,50,0.8)') // using rgba value
// or
const color = Color('hsl(120,30%,50%)') // using hsl value
// or
const color = Color('hsla(120,30%,50%,0.7)') // using hsla value
...
...
// manipulate color as per your needs
// to lighten the color
const lightColor = color.lighten(10) // it accepts a number as amount of ratio to lighten the color
// to darken the color
const darkColor = color.darken(20) // it accepts a number as amount of ratio to darken the color
// to negate the color
const negatedColor = color.negate()
// to get the luminance of color
const luminance = color.luminance
// to get the contrast color
const contrastColor = color.contrast
// to ser the threshold for contrast color
color.setThreshold(100) // default is 128
// to get the threshold of contrast color
const threshold = color.threshold
...
...
// then you can get the updated color in any format
const lightColorHEX = lightColor.hex
const lightColorRGB = lightColor.rgb
const darkColorHEXA = darkColor.hexa
const darkColorRGBA = darkColor.rgba
const lightColorHSL = lightColor.hsl
const lightColorHSLA = lightColor.hsla
...
...
Colors |
---|
red |
pink |
purple |
violet |
indigo |
blue |
lightBlue |
cyan |
teal |
green |
lightGreen |
lime |
yellow |
amber |
orange |
deepOrange |
brown |
gray |
blueGray |
white |
black |
MIT