Filter

Grayscale

Utilities for applying grayscale filters to an element.

Basic usage

Making an element grayscale

Use the grayscale and grayscale-0 utilities to control whether an element should be rendered as grayscale or in full color.

grayscale-0

grayscale

<div className="**grayscale-0** ...">
  <!-- ... -->
</div>
<div className="**grayscale** ...">
  <!-- ... -->
</div>