Filter Functions

The CSS filter property applies graphical effects like blur to an element. It is commonly used to adjust the rendering of images, backgrounds, and sometimes even borders.

Filter Functions

blur()
Defines the blur radius of an element.
brightness()
Defines the brightness or darkness of an element.
contrast()
Defines the contrast on an element.
drop-shadow()
Creates a drop shadow effect on an element.
grayscale()
Converts an element to grayscale.
hue-rotate()
Accepts an angle value and rotates the hue of an element.
invert()
Inverts the colors of an element.
opacity()
Controls how much of the background is visible through the element it is applied to.
saturate()
Increase or decrease the intensity of the color of the element it is applied to.
sepia()
Changes the color of an element to sepia.

Contributors

Interested in helping build Docs? Read the Contribution Guide or share your thoughts in this feedback form.

Learn CSS on Codecademy

Contributors