Documentación offline Tailwind CSS main
por @raupulus

filter: contrast()

main Ver versión oficial en línea Licencia MITDescargado el 2026-09-15 Bundle .md (1.3 MB) ↓

En esta página
Clase Propiedades CSS
contrast-<number> filter: contrast(<number>%);
contrast-(<custom-property>) filter: contrast(var(<custom-property>));
contrast-[<value>] filter: contrast(<value>);

Examples#

Basic example#

Use utilities like contrast-50 and contrast-100 to control an element's contrast:

{

contrast-50

contrast-100

contrast-125

contrast-200

}

<!-- [!code classes:contrast-50,contrast-100,contrast-125,contrast-200] -->
<img class="contrast-50 ..." src="/img/mountains.jpg" />
<img class="contrast-100 ..." src="/img/mountains.jpg" />
<img class="contrast-125 ..." src="/img/mountains.jpg" />
<img class="contrast-200 ..." src="/img/mountains.jpg" />

Using a custom value#

Responsive design#