The CSS filter property allows you to apply a number of image editing effects to an HTML element, such as an image or a text box. One such effect is contrast, which allows you to adjust the contrast of an element.
The contrast value determines how different the colors of the image are from the original. A higher contrast value increases the difference between the colors, while a lower value decreases this difference.
Here is an example of how you can use the contrast property in CSS:
img {
filter: contrast(100%);
}
img.high-contrast {
filter: contrast(150%);
}
img.low-contrast {
filter: contrast(70%);
}
In this example, the filter property is applied to an image with three different contrast values. The default value is 100%, which does not change the contrast. The values assigned to the high-contrast and low-contrast classes increase and decrease the contrast respectively.
It is important to note that support for the filter property may vary from browser to browser, and not all browsers provide the same filtering effects. Check your browser compatibility and test the desired effects in multiple browsers to make sure they work properly.
Select Language
Set theme
© 2024 ReadyTools. All rights reserved.