saturate()
The saturate() CSS function super-saturates or desaturates the input image. Its result is a <filter-function>.
Try it
Syntax
css
saturate(amount)
Parameters
amount-
The amount of the conversion, specified as a
<number>or a<percentage>. A value under100%desaturates the image, while a value over100%super-saturates it. A value of0%is completely unsaturated, while a value of100%leaves the input unchanged. The initial value for interpolation is1.
Examples
Examples of correct values for saturate()
css
saturate(0) /* Completely unsaturated */
saturate(.4) /* 40% saturated */
saturate(100%) /* No effect */
saturate(200%) /* Double saturation */
Specifications
| Specification |
|---|
| Filter Effects Module Level 1 # funcdef-filter-saturate |
Browser compatibility
| desktop | mobile | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
saturate() | |||||||||||
See also
The other <filter-function> functions available to be used in values of the filter and backdrop-filter properties include: