culori

What is culori?

The 'culori' npm package is a comprehensive color library for JavaScript that provides a wide range of functionalities for color manipulation, conversion, and analysis. It supports various color spaces and formats, making it a versatile tool for developers working with colors in web development, data visualization, and other applications.

What are culori's main functionalities?

Color Conversion

This feature allows you to convert colors between different color spaces. In the example, an RGB color is converted to the LAB color space.

const culori = require('culori');
const rgbColor = culori.rgb('#ff0000');
const labColor = culori.lab(rgbColor);
console.log(labColor);

Color Manipulation

This feature provides functions to manipulate colors, such as lightening or darkening them. The example demonstrates how to lighten an HSL color.

const culori = require('culori');
const color = culori.hsl({ h: 0, s: 1, l: 0.5 });
const lighterColor = culori.lighten(color, 0.2);
console.log(lighterColor);

Color Parsing

This feature allows you to parse color strings into color objects. The example shows how to parse a hex color string into an RGB color object.

const culori = require('culori');
const color = culori.parse('#ff0000');
console.log(color);

Color Interpolation

This feature enables color interpolation between two or more colors. The example demonstrates how to find a color that is halfway between red and blue.

const culori = require('culori');
const interpolate = culori.interpolate(['#ff0000', '#0000ff']);
const midColor = interpolate(0.5);
console.log(midColor);

Color Difference

This feature allows you to calculate the difference between two colors. The example shows how to compute the Euclidean difference between red and green colors.

const culori = require('culori');
const color1 = culori.rgb('#ff0000');
const color2 = culori.rgb('#00ff00');
const difference = culori.differenceEuclidean(color1, color2);
console.log(difference);

Other packages similar to culori

chroma-js

Chroma.js is another popular color library for JavaScript that provides similar functionalities for color manipulation, conversion, and analysis. It supports various color spaces and offers a rich set of features for working with colors. Compared to 'culori', Chroma.js has a more extensive API for color scales and palettes, making it particularly useful for data visualization.

color

The 'color' npm package is a versatile library for color conversion and manipulation. It supports a wide range of color spaces and provides methods for color transformations. While 'culori' focuses on a broader set of color spaces and more advanced color science features, 'color' is simpler and easier to use for basic color operations.

tinycolor2

TinyColor2 is a lightweight color manipulation library that offers basic functionalities for color conversion, manipulation, and analysis. It is designed to be small and fast, making it suitable for performance-sensitive applications. Compared to 'culori', TinyColor2 has a more limited feature set but is easier to integrate into projects where minimal overhead is desired.

README

Culori

Culori is a general-purpose color library for JavaScript.

Why I built this

There are already several excellent libraries out there for manipulating colors in JavaScript.

This library aims to provide a simple API to:

Convert between a variety of color formats.

Build a color picker for a particular format. Let's take the ubiquitous HSV color picker; the library should allow me to:

• map the user interface for the h, s, v values to a color that I can then convert to any other format
• for a color in any format the user can input (these will usually be the CSS Colors Level 4), obtain the representation in HSV space, so the interface can be updated accordingly

Of particular interest is deciding when to apply the alpha channel to the interface (i.e. to an opacity slider). If the interface contains color swatches, I should decide whether to use the alpha channel or not:

• if the user inputs #ffffff I might only use the h, s and v value;
• if the user inputs #ffffff00 I might also want to apply the a: 0 value.

Create color schemes based on a base color.

Obtain color scales to use in data visualization.

Supported formats

The library supports all the color formats defined in the CSS Colors Level 4:

• Named colors
• Hex colors (with 3, 4, 6, or 8 digits)
• RGB and RGBA
• HSL and HSLA
• HWB
• LAB and LCH
• Grays

Additionally, it supports:

• HSV (also called HSB)
• HSI
• CubeHelix (soon)

Documentation

• Getting Started with Culori
• Culori Recipes
• Extending Culori
• API Reference
• Benchmarks
• Further Reading

About the project

Culori is written by Dan Burzo and is released under the MIT License.

It builds upon the ideas of two thoroughly documented and time-tested projects: d3-color and d3-interpolate by Mike Bostock, and chroma.js by Gregor Aisch.

You may also want to look at TinyColor by Brian Grinstead, color by Heather Arthur, and color.js by Andrew Brehaut et al.