CSS
HTML
COMPONENTS
CODE HUB
CSS Brightness Generator BETA
Configuration
Brightness
Class
Preview
Code
CSS Brightness Generator
The word brightness in English refers to the degree of illumination or the intensity of light. In CSS, brightness is one of the values for the filter property, allowing you to adjust the brightness or intensity of an element. The brightness value is specified as a percentage, indicating how bright or dim the element should be compared to its original state.
For example:
- brightness(100%): Maintains the original brightness or intensity.
- brightness(50%): Reduces the element's brightness or intensity by half, resulting in a darker appearance.
- brightness(200%): Doubles the element's brightness or intensity, resulting in a brighter appearance.
Here's a CSS example of how to use the brightness filter property:
.my-element {
filter: brightness(100%);
}
.my-element.dim {
filter: brightness(50%);
}
.my-element.bright {
filter: brightness(200%);
}
This code demonstrates how you can adjust the brightness of elements on your web page using the brightness filter property in CSS. The element with the class .my-element can have its brightness adjusted by adding different classes such as .dim for reduced brightness or .bright for increased brightness, as shown in the example.
Select Language:
© 2024 ReadyTools. All rights reserved.