brightness()

Published Jul 12, 2021Updated Nov 10, 2023
Contribute to Docs

Defines the brightness or darkness of an element.

Syntax

filter: brightness(<value>);

where a required <value> can be one of the following:

  • Number value: 0, 1.4
  • Percentage value: 100%, 50%

Example

The example below applies the brightness filter to the Codecademy banner icon image.

.banner-image {
filter: brightness(150%);
}

CSS brightness filter example

Here, the original image is on the left and the image on the right has the filter set at brightness(150%).

All contributors

Looking to contribute?

Learn CSS on Codecademy