The d3-color npm package provides a robust framework for color manipulation and conversion. It allows users to parse color strings, manipulate colors in different color spaces, and format colors for display. It is part of the larger D3 (Data-Driven Documents) suite of tools, which are used for manipulating documents based on data.

What are d3-color's main functionalities?

Parsing and Formatting Colors

This feature allows users to parse CSS color strings and then format them back into a string. The example shows how to parse 'steelblue' into a color object and then output it as an RGB string.

"var color = d3.color('steelblue');\nconsole.log(color.toString()); // 'rgb(70, 130, 180)'"

Manipulating Color Channels

Users can directly manipulate the channels of a color, including its opacity. In the example, an RGB color is created and its opacity is set before converting it back to a string.

"var color = d3.rgb(70, 130, 180);\ncolor.opacity = 0.5;\nconsole.log(color.toString()); // 'rgba(70, 130, 180, 0.5)'"

Working with Different Color Spaces

d3-color supports various color spaces such as RGB, HSL, and LAB. This example demonstrates converting an HSL color to its equivalent RGB string.

"var color = d3.hsl(210, 0.44, 0.49);\nconsole.log(color.toString()); // 'rgb(70, 130, 180)'"

Other packages similar to d3-color

Readme

Source

d3-color

Colorspaces! This code is currently EXPERIMENTAL and represents the in-development D3 4.0 API. The 4.0 API is largely backwards-compatible, but differs from 3.x in several ways:

Parsing RGB colors with percentages is now supported (e.g., rgb(30%,40%,50%)). Decimal values where integers are required are no longer allowed (e.g., rgb(100.5,0,0) is not a valid color).
The rgb.brighter method no longer special-cases behavior for black and very dark channels; it is now a simple channel multiplier, consistent with rgb.darker and implementations in the other colorspaces.
The rgb.hsl method has been removed; use the hsl constructor to convert any color to the HSL colorspace (e.g., hsl(rgb)).
All colorspaces, including RGB, now support the color.rgb method. This method returns a new color instance representing the nearest-equivalent color in the RGB colorspace.
Colors are now validated upon construction. For example, an RGB color’s r, g and b values are integers in the range [0,100]. An HSL color’s h is a number in the range [0,360), while s and l are numbers in the range [0,1].
A new color method parses the specified string according to CSS Color Module Level 3 and returns the corresponding color in its colorspace. For HSL color values, this is the HSL colorspace; for other values, the RGB colorspace is used.

FAQs

What is d3-color?

Is d3-color popular?

Is d3-color well maintained?

Last updated on 03 Jun 2015

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install