PigmentJS 🐽 🍬
PigmentJS is a very, very simple zero-dependency colour library built for web developers to easily create beautiful, legible, and accessible colour palettes.
Quick Start
Install
npm i --save pigmentjs
Use Pigment
Instantiate PigmentJS to generate a random colour, or use a 3 or 6 character Hex string.
// Requireconst Pigment = ;// OR// Import ; // Random colour;;
Create colours
const pigment = ;const complementary = pigmenthex; // '#E609FF'const triad = pigment; // [Pigment(), Pigment(), Pigment()];
Pigment()
API
Getters
Pigment().rgb
rgb; // [239, 56, 230]
Pigment().rgbString
rgbString; // '239, 56, 230'
Pigment().hex
hex; // '#EF38E6'
Pigment().hsl
hsl; // [302, 85.1, 57.8]
Pigment().hslString
hslString; // '302, 85.1, 57.8'
Pigment().hue
hue; // 302
Pigment().saturation
saturation; // 85.1
Pigment().lightness
lightness; // 57.8
Pigment().relativeLuminance
relativeLuminance; // 0.56
Pigment().textColourHex
Returns black or white, whichever will have a higher contrast relative to the primary colour.
textColourHex; // '#FFFFFF'
Methods
Always returns a new Pigment instance or an array of Pigment instances.
Pigment().complementary()
Converts colour to HSL, rotates Hue by 180 degrees.
; // Pigment() (complementary colour)
Pigment().triad()
Converts colour to HSL, rotates Hue by 120 degrees either side.
const pigment = ;pigment; // [colour (itself), Pigment(), Pigment()]
Pigment().monochrome(5)
Returns an array of colours with a monochromatic relationship to the input colour (i.e. an almost identical Hue).
Params
Size Int
- How many new colours to return
const pigment = ;pigment; // [Pigment(), Pigment(), Pigment()]
Pigment().shades(5)
Returns an array of colours with black mixed progressively.
Params
Size Int
- How many new colours to return
const pigment = ;pigment; // [Pigment(), Pigment(), Pigment()]
Deploying
- Bump verion number
npm version [major|minor|patch]
- Build and publish
npm publish