# Filters

- [Backdrop Blur](#backdrop-blur)
- [Backdrop Brightness](#backdrop-brightness)
- [Backdrop Contrast](#backdrop-contrast)
- [Backdrop Grayscale](#backdrop-grayscale)
- [Backdrop Hue Rotate](#backdrop-hue-rotate)
- [Backdrop Invert](#backdrop-invert)
- [Backdrop Opacity](#backdrop-opacity)
- [Backdrop Saturate](#backdrop-saturate)
- [Backdrop Sepia](#backdrop-sepia)
- [Blur](#blur)
- [Brightness](#brightness)
- [Contrast](#contrast)
- [Drop Shadow](#drop-shadow)
- [Grayscale](#grayscale)
- [Hue Rotate](#hue-rotate)
- [Invert](#invert)
- [Saturate](#saturate)
- [Sepia](#sepia)

-----


## Backdrop Blur

Utilities for applying backdrop blur filters to an element.

### Group

| TailwindJS token |
| ----- |
| `backdrop_blur_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_blur` | [backdrop-blur](#backdrop_blur) |
| `backdrop_blur_2xl` | [backdrop-blur-2xl](#backdrop_blur) |
| `backdrop_blur_3xl` | [backdrop-blur-3xl](#backdrop_blur) |
| `backdrop_blur_lg` | [backdrop-blur-lg](#backdrop_blur) |
| `backdrop_blur_md` | [backdrop-blur-md](#backdrop_blur) |
| `backdrop_blur_none` | [backdrop-blur-none](#backdrop_blur) |
| `backdrop_blur_sm` | [backdrop-blur-sm](#backdrop_blur) |
| `backdrop_blur_xl` | [backdrop-blur-xl](#backdrop_blur) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_arbitrary`, `backdrop_arb` | [backdrop-[…]](#https://tailwindcss.com/docs/backdrop-blur#arbitrary-values) |
| `backdrop_blur_arbitrary`, `backdrop_blur_arb` | [backdrop-blur-[…]](#https://tailwindcss.com/docs/backdrop-blur#arbitrary-values) |



## Backdrop Brightness

Utilities for applying backdrop brightness filters to an element.

### Group

| TailwindJS token |
| ----- |
| `backdrop_brightness_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_brightness_0` | [backdrop-brightness-0](#backdrop_brightness) |
| `backdrop_brightness_100` | [backdrop-brightness-100](#backdrop_brightness) |
| `backdrop_brightness_105` | [backdrop-brightness-105](#backdrop_brightness) |
| `backdrop_brightness_110` | [backdrop-brightness-110](#backdrop_brightness) |
| `backdrop_brightness_125` | [backdrop-brightness-125](#backdrop_brightness) |
| `backdrop_brightness_150` | [backdrop-brightness-150](#backdrop_brightness) |
| `backdrop_brightness_200` | [backdrop-brightness-200](#backdrop_brightness) |
| `backdrop_brightness_50` | [backdrop-brightness-50](#backdrop_brightness) |
| `backdrop_brightness_75` | [backdrop-brightness-75](#backdrop_brightness) |
| `backdrop_brightness_90` | [backdrop-brightness-90](#backdrop_brightness) |
| `backdrop_brightness_95` | [backdrop-brightness-95](#backdrop_brightness) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_brightness_arbitrary`, `backdrop_brightness_arb` | [backdrop-brightness-[…]](#https://tailwindcss.com/docs/backdrop-brightness#arbitrary-values) |



## Backdrop Contrast

Utilities for applying backdrop contrast filters to an element.

### Group

| TailwindJS token |
| ----- |
| `backdrop_contrast_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_contrast_0` | [backdrop-contrast-0](#backdrop_contrast) |
| `backdrop_contrast_100` | [backdrop-contrast-100](#backdrop_contrast) |
| `backdrop_contrast_125` | [backdrop-contrast-125](#backdrop_contrast) |
| `backdrop_contrast_150` | [backdrop-contrast-150](#backdrop_contrast) |
| `backdrop_contrast_200` | [backdrop-contrast-200](#backdrop_contrast) |
| `backdrop_contrast_50` | [backdrop-contrast-50](#backdrop_contrast) |
| `backdrop_contrast_75` | [backdrop-contrast-75](#backdrop_contrast) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_contrast_arbitrary`, `backdrop_contrast_arb` | [backdrop-contrast-[…]](#https://tailwindcss.com/docs/backdrop-contrast#arbitrary-values) |



## Backdrop Grayscale

Utilities for applying backdrop grayscale filters to an element.

### Group

| TailwindJS token |
| ----- |
| `backdrop_grayscale_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_grayscale` | [backdrop-grayscale](#backdrop_grayscale) |
| `backdrop_grayscale_0` | [backdrop-grayscale-0](#backdrop_grayscale) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_grayscale_arbitrary`, `backdrop_grayscale_arb` | [backdrop-grayscale-[…]](#https://tailwindcss.com/docs/backdrop-grayscale#arbitrary-values) |



## Backdrop Hue Rotate

Utilities for applying backdrop hue-rotate filters to an element.

### Group

| TailwindJS token |
| ----- |
| `backdrop_hue_rotate_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_hue_rotate_0` | [backdrop-hue-rotate-0](#backdrop_hue_rotate) |
| `backdrop_hue_rotate_15` | [backdrop-hue-rotate-15](#backdrop_hue_rotate) |
| `backdrop_hue_rotate_180` | [backdrop-hue-rotate-180](#backdrop_hue_rotate) |
| `backdrop_hue_rotate_30` | [backdrop-hue-rotate-30](#backdrop_hue_rotate) |
| `backdrop_hue_rotate_60` | [backdrop-hue-rotate-60](#backdrop_hue_rotate) |
| `backdrop_hue_rotate_90` | [backdrop-hue-rotate-90](#backdrop_hue_rotate) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_hue_rotate_arbitrary`, `backdrop_hue_rotate_arb` | [backdrop-hue-rotate-[…]](#https://tailwindcss.com/docs/backdrop-hue-rotate#arbitrary-values) |



## Backdrop Invert

Utilities for applying backdrop invert filters to an element.

### Group

| TailwindJS token |
| ----- |
| `backdrop_invert_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_invert` | [backdrop-invert](#backdrop_invert) |
| `backdrop_invert_0` | [backdrop-invert-0](#backdrop_invert) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_invert_arbitrary`, `backdrop_invert_arb` | [backdrop-invert-[…]](#https://tailwindcss.com/docs/backdrop-invert#arbitrary-values) |



## Backdrop Opacity

Utilities for applying backdrop opacity filters to an element.

### Group

| TailwindJS token |
| ----- |
| `backdrop_opacity_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_opacity_0` | [backdrop-opacity-0](#backdrop_opacity) |
| `backdrop_opacity_10` | [backdrop-opacity-10](#backdrop_opacity) |
| `backdrop_opacity_100` | [backdrop-opacity-100](#backdrop_opacity) |
| `backdrop_opacity_15` | [backdrop-opacity-15](#backdrop_opacity) |
| `backdrop_opacity_20` | [backdrop-opacity-20](#backdrop_opacity) |
| `backdrop_opacity_25` | [backdrop-opacity-25](#backdrop_opacity) |
| `backdrop_opacity_30` | [backdrop-opacity-30](#backdrop_opacity) |
| `backdrop_opacity_35` | [backdrop-opacity-35](#backdrop_opacity) |
| `backdrop_opacity_40` | [backdrop-opacity-40](#backdrop_opacity) |
| `backdrop_opacity_45` | [backdrop-opacity-45](#backdrop_opacity) |
| `backdrop_opacity_5` | [backdrop-opacity-5](#backdrop_opacity) |
| `backdrop_opacity_50` | [backdrop-opacity-50](#backdrop_opacity) |
| `backdrop_opacity_55` | [backdrop-opacity-55](#backdrop_opacity) |
| `backdrop_opacity_60` | [backdrop-opacity-60](#backdrop_opacity) |
| `backdrop_opacity_65` | [backdrop-opacity-65](#backdrop_opacity) |
| `backdrop_opacity_70` | [backdrop-opacity-70](#backdrop_opacity) |
| `backdrop_opacity_75` | [backdrop-opacity-75](#backdrop_opacity) |
| `backdrop_opacity_80` | [backdrop-opacity-80](#backdrop_opacity) |
| `backdrop_opacity_85` | [backdrop-opacity-85](#backdrop_opacity) |
| `backdrop_opacity_90` | [backdrop-opacity-90](#backdrop_opacity) |
| `backdrop_opacity_95` | [backdrop-opacity-95](#backdrop_opacity) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_opacity_arbitrary`, `backdrop_opacity_arb` | [backdrop-opacity-[…]](#https://tailwindcss.com/docs/backdrop-opacity#arbitrary-values) |



## Backdrop Saturate

Utilities for applying backdrop saturation filters to an element.

### Group

| TailwindJS token |
| ----- |
| `backdrop_saturate_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_saturate_0` | [backdrop-saturate-0](#backdrop_saturate) |
| `backdrop_saturate_100` | [backdrop-saturate-100](#backdrop_saturate) |
| `backdrop_saturate_150` | [backdrop-saturate-150](#backdrop_saturate) |
| `backdrop_saturate_200` | [backdrop-saturate-200](#backdrop_saturate) |
| `backdrop_saturate_50` | [backdrop-saturate-50](#backdrop_saturate) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_saturate_arbitrary`, `backdrop_saturate_arb` | [backdrop-saturate-[…]](#https://tailwindcss.com/docs/backdrop-saturate#arbitrary-values) |



## Backdrop Sepia

Utilities for applying backdrop sepia filters to an element.

### Group

| TailwindJS token |
| ----- |
| `backdrop_sepia_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_sepia` | [backdrop-sepia](#backdrop_sepia) |
| `backdrop_sepia_0` | [backdrop-sepia-0](#backdrop_sepia) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `backdrop_sepia_arbitrary`, `backdrop_sepia_arb` | [backdrop-sepia-[…]](#https://tailwindcss.com/docs/backdrop-sepia#arbitrary-values) |



## Blur

Utilities for applying blur filters to an element.

### Group

| TailwindJS token |
| ----- |
| `blur_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `blur` | [blur](#blur) |
| `blur_2xl` | [blur-2xl](#blur) |
| `blur_3xl` | [blur-3xl](#blur) |
| `blur_lg` | [blur-lg](#blur) |
| `blur_md` | [blur-md](#blur) |
| `blur_none` | [blur-none](#blur) |
| `blur_sm` | [blur-sm](#blur) |
| `blur_xl` | [blur-xl](#blur) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `blur_arbitrary`, `blur_arb` | [blur-[…]](#https://tailwindcss.com/docs/blur#arbitrary-values) |



## Brightness

Utilities for applying brightness filters to an element.

### Group

| TailwindJS token |
| ----- |
| `brightness_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `brightness_0` | [brightness-0](#brightness) |
| `brightness_100` | [brightness-100](#brightness) |
| `brightness_105` | [brightness-105](#brightness) |
| `brightness_110` | [brightness-110](#brightness) |
| `brightness_125` | [brightness-125](#brightness) |
| `brightness_150` | [brightness-150](#brightness) |
| `brightness_200` | [brightness-200](#brightness) |
| `brightness_50` | [brightness-50](#brightness) |
| `brightness_75` | [brightness-75](#brightness) |
| `brightness_90` | [brightness-90](#brightness) |
| `brightness_95` | [brightness-95](#brightness) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `brightness_arbitrary`, `brightness_arb` | [brightness-[…]](#https://tailwindcss.com/docs/brightness#arbitrary-values) |



## Contrast

Utilities for applying contrast filters to an element.

### Group

| TailwindJS token |
| ----- |
| `contrast_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `contrast_0` | [contrast-0](#contrast) |
| `contrast_100` | [contrast-100](#contrast) |
| `contrast_125` | [contrast-125](#contrast) |
| `contrast_150` | [contrast-150](#contrast) |
| `contrast_200` | [contrast-200](#contrast) |
| `contrast_50` | [contrast-50](#contrast) |
| `contrast_75` | [contrast-75](#contrast) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `contrast_arbitrary`, `contrast_arb` | [contrast-[…]](#https://tailwindcss.com/docs/contrast#arbitrary-values) |



## Drop Shadow

Utilities for applying drop-shadow filters to an element.

### Group

| TailwindJS token |
| ----- |
| `drop_shadow_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `drop_shadow` | [drop-shadow](#drop_shadow) |
| `drop_shadow_2xl` | [drop-shadow-2xl](#drop_shadow) |
| `drop_shadow_lg` | [drop-shadow-lg](#drop_shadow) |
| `drop_shadow_md` | [drop-shadow-md](#drop_shadow) |
| `drop_shadow_none` | [drop-shadow-none](#drop_shadow) |
| `drop_shadow_sm` | [drop-shadow-sm](#drop_shadow) |
| `drop_shadow_xl` | [drop-shadow-xl](#drop_shadow) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `drop_arbitrary`, `drop_arb` | [drop-[…]](#https://tailwindcss.com/docs/drop-shadow#arbitrary-values) |
| `drop_shadow_arbitrary`, `drop_shadow_arb` | [drop-shadow-[…]](#https://tailwindcss.com/docs/drop-shadow#arbitrary-values) |



## Grayscale

Utilities for applying grayscale filters to an element.

### Group

| TailwindJS token |
| ----- |
| `grayscale_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `grayscale` | [grayscale](#grayscale) |
| `grayscale_0` | [grayscale-0](#grayscale) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `grayscale_arbitrary`, `grayscale_arb` | [grayscale-[…]](#https://tailwindcss.com/docs/grayscale#arbitrary-values) |



## Hue Rotate

Utilities for applying hue-rotate filters to an element.

### Group

| TailwindJS token |
| ----- |
| `hue_rotate_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `hue_rotate_0` | [hue-rotate-0](#hue_rotate) |
| `hue_rotate_15` | [hue-rotate-15](#hue_rotate) |
| `hue_rotate_180` | [hue-rotate-180](#hue_rotate) |
| `hue_rotate_30` | [hue-rotate-30](#hue_rotate) |
| `hue_rotate_60` | [hue-rotate-60](#hue_rotate) |
| `hue_rotate_90` | [hue-rotate-90](#hue_rotate) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `hue_rotate_arbitrary`, `hue_rotate_arb` | [hue-rotate-[…]](#https://tailwindcss.com/docs/hue-rotate#arbitrary-values) |



## Invert

Utilities for applying invert filters to an element.

### Group

| TailwindJS token |
| ----- |
| `invert_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `invert` | [invert](#invert) |
| `invert_0` | [invert-0](#invert) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `invert_arbitrary`, `invert_arb` | [invert-[…]](#https://tailwindcss.com/docs/invert#arbitrary-values) |



## Saturate

Utilities for applying saturation filters to an element.

### Group

| TailwindJS token |
| ----- |
| `saturate_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `saturate_0` | [saturate-0](#saturate) |
| `saturate_100` | [saturate-100](#saturate) |
| `saturate_150` | [saturate-150](#saturate) |
| `saturate_200` | [saturate-200](#saturate) |
| `saturate_50` | [saturate-50](#saturate) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `saturate_arbitrary`, `saturate_arb` | [saturate-[…]](#https://tailwindcss.com/docs/saturate#arbitrary-values) |



## Sepia

Utilities for applying sepia filters to an element.

### Group

| TailwindJS token |
| ----- |
| `sepia_utilities` |


### Utilities

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `sepia` | [sepia](#sepia) |
| `sepia_0` | [sepia-0](#sepia) |



### Arbitraries

| TailwindJS token | TailwindCSS token |
| ----- | ----- |
| `sepia_arbitrary`, `sepia_arb` | [sepia-[…]](#https://tailwindcss.com/docs/sepia#arbitrary-values) |