@philiprehberger/color-kit

Lightweight color parsing, conversion, and manipulation

Installation

npm install @philiprehberger/color-kit

Usage

import { color } from '@philiprehberger/color-kit';

const c = color('#3b82f6');
c.lighten(20).toHex();       // lighter blue
c.opacity(0.5).toRGB();      // "rgba(59, 130, 246, 0.5)"
c.contrast(color('#ffffff')); // WCAG contrast ratio
c.isDark();                   // true
c.mix(color('#ef4444'), 0.5); // blended color

Color Harmonies

color('#3b82f6').complementary(); // [Color]
color('#3b82f6').analogous();     // [Color, Color]
color('#3b82f6').triadic();       // [Color, Color]

API

Method	Description
`color(input)`	Parse hex, rgb(), hsl(), or named color
`.toHex()` / `.toRGB()` / `.toHSL()` / `.toHSB()`	Convert
`.lighten(n)` / `.darken(n)`	Adjust lightness
`.saturate(n)` / `.desaturate(n)`	Adjust saturation
`.opacity(a)` / `.invert()` / `.grayscale()`	Transform
`.mix(other, ratio)`	Blend two colors
`.contrast(other)`	WCAG 2.1 contrast ratio
`.isLight()` / `.isDark()`	Luminance check
`.complementary()` / `.analogous()` / `.triadic()`	Harmonies