@philiprehberger/color-kit
v0.1.5652 downloadsMIT
Lightweight color parsing, conversion, and manipulation
$
npm install @philiprehberger/color-kitREADME
@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 |
Development
npm install
npm run build
npm test
Support
If you find this project useful: