@kurkle/color

Overview

Fast and small CSS color parsing and manipulation library.

Parsing

Supported formats:

• named

blue
transparent

• hex

#aaa
#bbba
#1A2b3c
#f1f2f388

• rgb(a)

rgb(255, 255, 255)
rgb(255, 0, 0, 0.5)
rgb(50%, 50%, 50%, 50%)
rgb(0 0 100% / 80%)
rgba(200, 20, 233, 0.2)
rgba(200, 20, 233, 2e-1)

• hsl(a)

hsl(240deg, 100%, 50.5%)
hsl(0deg 100% 50%)
hsla(12, 10%, 50%, .3)
hsla(-1.2, 10.2%, 50.9%, 0.4)

• hwb

hwb(240, 100%, 50.5%)
hwb(244, 100%, 100%, 0.6)

• hsv

hsv(240, 100%, 50.5%)
hsv(244, 100%, 100%, 0.6)

• oklch

oklch(0.7 0.15 200)
oklch(70% 0.15 200deg / 50%)
oklch(0.5 0.2 30 / 0.5)

Out-of-gamut colors are clipped to sRGB, matching what browsers draw on a canvas.

Docs

typedocs

note The docs are for the ESM module. UMD module only exports the default export

Documentation Generation

The documentation is automatically generated using TypeDoc and deployed to GitHub Pages whenever changes are pushed to the main branch.

To generate documentation locally:

npm run docs

This will create documentation in the docs directory, which you can preview locally before pushing changes.

Benchmarks

benchmarks — see bench/README.md for how to run them locally.

Size visualization

color.min.js

License

@kurkle/color is available under the MIT license.