colorGrayscale

Strips a color’s saturation while keeping its lightness and alpha, so a de-emphasized mark keeps the contrast it had (and a transparent fill stays transparent). Values d3-color can’t parse, such as "none", are returned unchanged.

Basic example

Removes a color’s saturation but keeps its lightness and alpha, so each gray is as light as the color it replaces. Charts use it to fade the marks outside a highlight while their labels keep the contrast they were given.

import {colorGrayscale} from "@d3plus/color";

colorGrayscale("#1c7ed6");
colorGrayscale("#c92a2a");
colorGrayscale("#f59f00");
colorGrayscale("rgba(47, 158, 68, 0.5)");

Parameters

import {colorGrayscale} from "@d3plus/color";

crequiredstring

A CSS color string.