CSS Attributes Index CSS Filters
Sets the level of brightness for an input image.
{ filter: brightness(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 brightness( ) CSS function adjusts a visual object’s brightness level, effectively making the image appear brighter or darker.
The passed parameter defines the amount of deviation from the element’s default brightness value.
A value of 1 or 100% leaves the input unchanged, while a value of 0 or 0% renders the input image completely dark ( no brightness ).
Values less than 1 ( or <100% ) reduces the effect, while values more than 1 ( or >100% ) increases the effect.
Negative values ( < 0 ) are ignored and render the element unchanged.
Brightness with values between 0 and 1 or between 0% and 100%.
filter: brightness(0.5) |
filter: brightness(1) |
filter: brightness(1.5) |
 |
 |
 |
filter: brightness(30%) |
filter: brightness(60%) |
filter: brightness(120%) |
 |
 |
 |
Brightness with value = 0 and with negative value.
filter: brightness(0) |
filter: brightness(-1) |
 |
 |
blur contrast hue-rotate