Filter

Contrast

Utilities for applying contrast filters to an element.

Basic usage

Changing element contrast

Use the contrast-{amount?} utilities to control an element's contrast.

contrast-50

contrast-100

contrast-125

contrast-200

<div className="**contrast-50** ...">
  <!-- ... -->
</div>
<div className="**contrast-100** ...">
  <!-- ... -->
</div>
<div className="**contrast-125** ...">
  <!-- ... -->
</div>
<div className="**contrast-200** ...">
  <!-- ... -->
</div>