CSS Attributes Index CSS Filters
Sets the level of opacity for an input image.
{ filter: opacity(number | percentage) }
| number |
Absolute positive floating-point number or a relative percentage value. |
The property is read/write with a default value of 1.
The opacity( ) CSS function adjusts the degree of an element’s opaqueness, which, in effect, applies transparency to the element.
The passed parameter defines the amount of deviation from the element’s default opacity.
A value of 1 or 100% leaves the input unchanged, while a value of 0 or 0% renders the input image completely transparent or blank.
Values between 0 and 1 or between 0% and 100% have linear multipliers on the effect. Lesser values reduce opacity, or increase transparency.
Values more than 1 ( or >100% ), and negative values ( < 0 ) are ignored and render the element unchanged.
Opacity with values between 0 and 1 or between 0% and 100%.
filter: opacity(0) |
filter: opacity(.25) |
filter: opacity(.5) |
 |
|
|
| |
filter: opacity(30%) |
filter: opacity(60%) |
filter: opacity(100%) |
|
|
|
Opacity with a negative value or with a value more than 1 or more than 100%. Image is unchanged.
filter: opacity(-1) |
filter: opacity(10) |
filter: opacity(150%) |
|
|
|
grayscale hue-rotate invert saturate sepia