kevinrodriguez-io
@kevinrodriguez-io/pigment-core 🌈 - Pigment's engine
- Color conversions between:
- HEX
- RGB
- HSL
- LAB
- XYZ
- 24 Hand-Picked Flat Colors in both shades (Light and Dark)
- Color shades generation
- Find most similar hand-picked Flat color from another color
- Get contrasting color text (Black / White) for another color
- Generate Color Schemes:
- Analogous
- Complementary
- Triadic
- Compatible with Chameleon Framework's Sketch, PhotoShop and Storyboard plugins.
Installing
npm i @kevinrodriguez-io/pigment-core --saveor
yarn add @kevinrodriguez-io/pigment-coreUsage
- Wrap your color * Supported formats: HEX, RGB, HSL
const hex = '#E74C3C'
const color = new Color(hex)- Get complementary color
color.complementaryColor- Get most similar Hand-Picked Flat color
color.nearestFlatColor- Get all color shades with a 25% separation
color.all(25)
color.nearestFlatColor.all(25) // Flat-color shades- Get color tints/shades (Array or single item) with a 25% separation
color.tints(25)
color.shades(25)
color.tint(25) // Just one color
color.shade(25) // Just one color- Get analogous color scheme (Regular & Flat)
color.analogousColorScheme
color.analogousFlatColorScheme- Get complementary color scheme
color.complementaryColorScheme
color.complementaryFlatColorScheme- Get triadic color scheme
color.triadicColorScheme
color.triadicFlatColorScheme- Get contrasting text color (Black/White)
color.contrastingTextColor
color.contrastingFlatTextColor // Flat version