Theme
/ API Reference / Color Manipulation
Theme
/ API Reference / Color Manipulation

grayscale

A small utility function that converts a CSS color value to grayscale by removing all saturation.
It uses the hsl color model to do so.

The Gist

import { grayscale } from '@weser/theme'

const gray = grayscale('red')
const grayVariable = grayscale('var(--background)')

Parameters

ParameterTypeDescription
valuestringThe CSS color value to convert to grayscale.

Returns

(string) A string that references a CSS color value with saturation set to 0.

Import Alias

For convenience, we also export a British English spelling alias.

import { greyscale } from '@weser/theme'
On this page