- Backdrop Blur
- Backdrop Brightness
- Backdrop Contrast
- Backdrop Grayscale
- Backdrop Hue Rotate
- Backdrop Invert
- Backdrop Opacity
- Backdrop Saturate
- Backdrop Sepia
- Blur
- Brightness
- Contrast
- Drop Shadow
- Grayscale
- Hue Rotate
- Invert
- Saturate
- Sepia
Utilities for applying backdrop blur filters to an element.
| TailwindJS token |
|---|
backdrop_blur_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_blur |
backdrop-blur |
backdrop_blur_2xl |
backdrop-blur-2xl |
backdrop_blur_3xl |
backdrop-blur-3xl |
backdrop_blur_lg |
backdrop-blur-lg |
backdrop_blur_md |
backdrop-blur-md |
backdrop_blur_none |
backdrop-blur-none |
backdrop_blur_sm |
backdrop-blur-sm |
backdrop_blur_xl |
backdrop-blur-xl |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_arbitrary, backdrop_arb |
backdrop-[…] |
backdrop_blur_arbitrary, backdrop_blur_arb |
backdrop-blur-[…] |
Utilities for applying backdrop brightness filters to an element.
| TailwindJS token |
|---|
backdrop_brightness_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_brightness_0 |
backdrop-brightness-0 |
backdrop_brightness_100 |
backdrop-brightness-100 |
backdrop_brightness_105 |
backdrop-brightness-105 |
backdrop_brightness_110 |
backdrop-brightness-110 |
backdrop_brightness_125 |
backdrop-brightness-125 |
backdrop_brightness_150 |
backdrop-brightness-150 |
backdrop_brightness_200 |
backdrop-brightness-200 |
backdrop_brightness_50 |
backdrop-brightness-50 |
backdrop_brightness_75 |
backdrop-brightness-75 |
backdrop_brightness_90 |
backdrop-brightness-90 |
backdrop_brightness_95 |
backdrop-brightness-95 |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_brightness_arbitrary, backdrop_brightness_arb |
backdrop-brightness-[…] |
Utilities for applying backdrop contrast filters to an element.
| TailwindJS token |
|---|
backdrop_contrast_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_contrast_0 |
backdrop-contrast-0 |
backdrop_contrast_100 |
backdrop-contrast-100 |
backdrop_contrast_125 |
backdrop-contrast-125 |
backdrop_contrast_150 |
backdrop-contrast-150 |
backdrop_contrast_200 |
backdrop-contrast-200 |
backdrop_contrast_50 |
backdrop-contrast-50 |
backdrop_contrast_75 |
backdrop-contrast-75 |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_contrast_arbitrary, backdrop_contrast_arb |
backdrop-contrast-[…] |
Utilities for applying backdrop grayscale filters to an element.
| TailwindJS token |
|---|
backdrop_grayscale_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_grayscale |
backdrop-grayscale |
backdrop_grayscale_0 |
backdrop-grayscale-0 |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_grayscale_arbitrary, backdrop_grayscale_arb |
backdrop-grayscale-[…] |
Utilities for applying backdrop hue-rotate filters to an element.
| TailwindJS token |
|---|
backdrop_hue_rotate_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_hue_rotate_0 |
backdrop-hue-rotate-0 |
backdrop_hue_rotate_15 |
backdrop-hue-rotate-15 |
backdrop_hue_rotate_180 |
backdrop-hue-rotate-180 |
backdrop_hue_rotate_30 |
backdrop-hue-rotate-30 |
backdrop_hue_rotate_60 |
backdrop-hue-rotate-60 |
backdrop_hue_rotate_90 |
backdrop-hue-rotate-90 |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_hue_rotate_arbitrary, backdrop_hue_rotate_arb |
backdrop-hue-rotate-[…] |
Utilities for applying backdrop invert filters to an element.
| TailwindJS token |
|---|
backdrop_invert_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_invert |
backdrop-invert |
backdrop_invert_0 |
backdrop-invert-0 |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_invert_arbitrary, backdrop_invert_arb |
backdrop-invert-[…] |
Utilities for applying backdrop opacity filters to an element.
| TailwindJS token |
|---|
backdrop_opacity_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_opacity_0 |
backdrop-opacity-0 |
backdrop_opacity_10 |
backdrop-opacity-10 |
backdrop_opacity_100 |
backdrop-opacity-100 |
backdrop_opacity_15 |
backdrop-opacity-15 |
backdrop_opacity_20 |
backdrop-opacity-20 |
backdrop_opacity_25 |
backdrop-opacity-25 |
backdrop_opacity_30 |
backdrop-opacity-30 |
backdrop_opacity_35 |
backdrop-opacity-35 |
backdrop_opacity_40 |
backdrop-opacity-40 |
backdrop_opacity_45 |
backdrop-opacity-45 |
backdrop_opacity_5 |
backdrop-opacity-5 |
backdrop_opacity_50 |
backdrop-opacity-50 |
backdrop_opacity_55 |
backdrop-opacity-55 |
backdrop_opacity_60 |
backdrop-opacity-60 |
backdrop_opacity_65 |
backdrop-opacity-65 |
backdrop_opacity_70 |
backdrop-opacity-70 |
backdrop_opacity_75 |
backdrop-opacity-75 |
backdrop_opacity_80 |
backdrop-opacity-80 |
backdrop_opacity_85 |
backdrop-opacity-85 |
backdrop_opacity_90 |
backdrop-opacity-90 |
backdrop_opacity_95 |
backdrop-opacity-95 |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_opacity_arbitrary, backdrop_opacity_arb |
backdrop-opacity-[…] |
Utilities for applying backdrop saturation filters to an element.
| TailwindJS token |
|---|
backdrop_saturate_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_saturate_0 |
backdrop-saturate-0 |
backdrop_saturate_100 |
backdrop-saturate-100 |
backdrop_saturate_150 |
backdrop-saturate-150 |
backdrop_saturate_200 |
backdrop-saturate-200 |
backdrop_saturate_50 |
backdrop-saturate-50 |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_saturate_arbitrary, backdrop_saturate_arb |
backdrop-saturate-[…] |
Utilities for applying backdrop sepia filters to an element.
| TailwindJS token |
|---|
backdrop_sepia_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_sepia |
backdrop-sepia |
backdrop_sepia_0 |
backdrop-sepia-0 |
| TailwindJS token | TailwindCSS token |
|---|---|
backdrop_sepia_arbitrary, backdrop_sepia_arb |
backdrop-sepia-[…] |
Utilities for applying blur filters to an element.
| TailwindJS token |
|---|
blur_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
blur |
blur |
blur_2xl |
blur-2xl |
blur_3xl |
blur-3xl |
blur_lg |
blur-lg |
blur_md |
blur-md |
blur_none |
blur-none |
blur_sm |
blur-sm |
blur_xl |
blur-xl |
| TailwindJS token | TailwindCSS token |
|---|---|
blur_arbitrary, blur_arb |
blur-[…] |
Utilities for applying brightness filters to an element.
| TailwindJS token |
|---|
brightness_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
brightness_0 |
brightness-0 |
brightness_100 |
brightness-100 |
brightness_105 |
brightness-105 |
brightness_110 |
brightness-110 |
brightness_125 |
brightness-125 |
brightness_150 |
brightness-150 |
brightness_200 |
brightness-200 |
brightness_50 |
brightness-50 |
brightness_75 |
brightness-75 |
brightness_90 |
brightness-90 |
brightness_95 |
brightness-95 |
| TailwindJS token | TailwindCSS token |
|---|---|
brightness_arbitrary, brightness_arb |
brightness-[…] |
Utilities for applying contrast filters to an element.
| TailwindJS token |
|---|
contrast_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
contrast_0 |
contrast-0 |
contrast_100 |
contrast-100 |
contrast_125 |
contrast-125 |
contrast_150 |
contrast-150 |
contrast_200 |
contrast-200 |
contrast_50 |
contrast-50 |
contrast_75 |
contrast-75 |
| TailwindJS token | TailwindCSS token |
|---|---|
contrast_arbitrary, contrast_arb |
contrast-[…] |
Utilities for applying drop-shadow filters to an element.
| TailwindJS token |
|---|
drop_shadow_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
drop_shadow |
drop-shadow |
drop_shadow_2xl |
drop-shadow-2xl |
drop_shadow_lg |
drop-shadow-lg |
drop_shadow_md |
drop-shadow-md |
drop_shadow_none |
drop-shadow-none |
drop_shadow_sm |
drop-shadow-sm |
drop_shadow_xl |
drop-shadow-xl |
| TailwindJS token | TailwindCSS token |
|---|---|
drop_arbitrary, drop_arb |
drop-[…] |
drop_shadow_arbitrary, drop_shadow_arb |
drop-shadow-[…] |
Utilities for applying grayscale filters to an element.
| TailwindJS token |
|---|
grayscale_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
grayscale |
grayscale |
grayscale_0 |
grayscale-0 |
| TailwindJS token | TailwindCSS token |
|---|---|
grayscale_arbitrary, grayscale_arb |
grayscale-[…] |
Utilities for applying hue-rotate filters to an element.
| TailwindJS token |
|---|
hue_rotate_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
hue_rotate_0 |
hue-rotate-0 |
hue_rotate_15 |
hue-rotate-15 |
hue_rotate_180 |
hue-rotate-180 |
hue_rotate_30 |
hue-rotate-30 |
hue_rotate_60 |
hue-rotate-60 |
hue_rotate_90 |
hue-rotate-90 |
| TailwindJS token | TailwindCSS token |
|---|---|
hue_rotate_arbitrary, hue_rotate_arb |
hue-rotate-[…] |
Utilities for applying invert filters to an element.
| TailwindJS token |
|---|
invert_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
invert |
invert |
invert_0 |
invert-0 |
| TailwindJS token | TailwindCSS token |
|---|---|
invert_arbitrary, invert_arb |
invert-[…] |
Utilities for applying saturation filters to an element.
| TailwindJS token |
|---|
saturate_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
saturate_0 |
saturate-0 |
saturate_100 |
saturate-100 |
saturate_150 |
saturate-150 |
saturate_200 |
saturate-200 |
saturate_50 |
saturate-50 |
| TailwindJS token | TailwindCSS token |
|---|---|
saturate_arbitrary, saturate_arb |
saturate-[…] |
Utilities for applying sepia filters to an element.
| TailwindJS token |
|---|
sepia_utilities |
| TailwindJS token | TailwindCSS token |
|---|---|
sepia |
sepia |
sepia_0 |
sepia-0 |
| TailwindJS token | TailwindCSS token |
|---|---|
sepia_arbitrary, sepia_arb |
sepia-[…] |