Style filter Property
Style filter Property
The filter property is used to add visual effects to images. It includes saturation, blur, and similar effects.
Syntax:-
Its syntax is:- object.style.filter OR object.style.filter = none | blur() | brightness() | contrast() | drop-shadow() | grayscale() | hue-rotate() | invert() | opacity() | saturate() | sepia()
Further Explanation:-
Filter | Description |
---|---|
none | Specifies no effects |
blur(px) | Applies a blur effect to the image. |
brightness(%) | Adjusts the brightness of the image. |
contrast(%) | Adjusts the contrast of the image. |
drop-shadow(h-shadow v-shadow blur spread color) | Applies a drop shadow effect to the image. |
grayscale(%) | Converts the image to grayscale. |
hue-rotate(deg) | Applies a hue rotation on the image. |
invert(%) | Inverts the samples in the image. |
opacity(%) | Sets the opacity level for the image. |
saturate(%) | Saturates the image. |
sepia(%) | Converts the image to sepia.. |
url() | The url() function takes the location of an XML file that specifies an SVG filter. |
initial | Sets this property to its default value. |
inherit | Inherits this property from its parent element. |