@csstools/convert-colors

What is @csstools/convert-colors?

The @csstools/convert-colors npm package provides functionality for converting colors between different color models such as RGB, HSL, HWB, and more. It can be used to manipulate and convert color values in various formats, which is useful for web development and design tasks where precise color management is required.

What are @csstools/convert-colors's main functionalities?

RGB to HSL conversion

Converts an RGB color value to its equivalent HSL value.

const { rgb2hsl } = require('@csstools/convert-colors');
const hsl = rgb2hsl(255, 0, 0); // Convert red from RGB to HSL

HSL to RGB conversion

Converts an HSL color value to its equivalent RGB value.

const { hsl2rgb } = require('@csstools/convert-colors');
const rgb = hsl2rgb(0, 100, 50); // Convert red from HSL to RGB

RGB to HEX conversion

Converts an RGB color value to its equivalent HEX value.

const { rgb2hex } = require('@csstools/convert-colors');
const hex = rgb2hex(255, 0, 0); // Convert red from RGB to HEX

HEX to RGB conversion

Converts a HEX color value to its equivalent RGB value.

const { hex2rgb } = require('@csstools/convert-colors');
const rgb = hex2rgb('#ff0000'); // Convert red from HEX to RGB

HWB to RGB conversion

Converts an HWB color value to its equivalent RGB value.

const { hwb2rgb } = require('@csstools/convert-colors');
const rgb = hwb2rgb(0, 0, 0); // Convert black from HWB to RGB

Other packages similar to @csstools/convert-colors

color-convert

A popular color conversion library that provides conversions between various color models. It has a similar range of functionalities as @csstools/convert-colors but with a different API and additional conversions like CMYK and ANSI.

chroma-js

A more comprehensive color manipulation library that not only allows color conversions but also provides features for color scale generation, color blending, and manipulation of color properties. It is more feature-rich compared to @csstools/convert-colors.

tinycolor2

A small, fast library for color parsing and manipulation. It provides color conversion as well as utility functions for readability, darkness, and other color-related calculations. It is a good alternative with a simple API.

README

Convert Colors

Convert Colors converts colors between RGB, HSL, HWB, Lab, LCH, HSV, and XYZ.

import convert from '@csstools/convert-colors';

convert.rgb2hsl(100, 100, 100); // [ 0, 0, 100 ]
convert.rgb2hwb(100, 100, 100); // [ 0, 100, 0 ]

convert.hsl2rgb(0, 0, 100); // [ 0, 100, 0 ]
convert.hsl2hwb(0, 0, 100); // [ 0, 100, 0 ]

convert.hwb2rgb(0, 100, 0); // [ 0, 0, 100 ]
convert.hwb2hsl(0, 100, 0); // [ 0, 0, 100 ]

convert.rgb2hue(0, 0, 100); // 240

Usage

Add Convert Colors to your build tool:

npm install @csstools/convert-colors --save-dev

Features

Conversions work by taking arguments that represents a color in one color space and returning an array of that same color in another color space.

• rgb2hsl(r, g, b)
• rgb2hwb(r, g, b)
• rgb2lab(r, g, b)
• rgb2lch(r, g, b)
• rgb2hsv(r, g, b)
• rgb2xyz(r, g, b)
• hsl2rgb(h, s, l)
• hsl2hwb(h, s, l)
• hsl2lab(h, s, l)
• hsl2lch(h, s, l)
• hsl2hsv(h, s, l)
• hsl2xyz(h, s, l)
• hwb2rgb(h, w, b)
• hwb2hsl(h, w, b)
• hwb2lab(h, w, b)
• hwb2lch(h, w, b)
• hwb2hsv(h, w, b)
• hwb2xyz(h, w, b)
• lab2rgb(l, a, b)
• lab2hsl(l, a, b)
• lab2hwb(l, a, b)
• lab2lch(l, a, b)
• lab2hsv(l, a, b)
• lab2xyz(l, a, b)
• lch2rgb(l, c, h)
• lch2hsl(l, c, h)
• lch2hwb(l, c, h)
• lch2lab(l, c, h)
• lch2hsv(l, c, h)
• lch2xyz(l, c, h)
• hsv2rgb(h, s, v)
• hsv2hsl(h, s, v)
• hsv2hwb(h, s, v)
• hsv2lab(h, s, v)
• hsv2lch(h, s, v)
• hsv2xyz(h, s, v)
• xyz2rgb(x, y, z)
• xyz2hsl(x, y, z)
• xyz2hwb(x, y, z)
• xyz2lab(x, y, z)
• xyz2lch(x, y, z)
• xyz2hsv(x, y, z)

Changelog

1.4.0 (January 27, 2018)

• Add LCH conversions
• Allow fallbacks in RGB conversions (for gray conversions)
• Add Lab and LCH tests
• Simplify test array joining
• Rename references from "LAB" to "Lab"