To invert the colors of an image in CSS, we can use the filter CSS property.
To invert the colors of an image in JavaScript, we can set the style.filter property of the element to the same value.
For instance, we can write:
<img src="https://picsum.photos/200/300">
to add an image.
Then we can invert the colors of the image with the following CSS:
img {
-webkit-filter: invert(1);
filter: invert(1);
}
We just set the -webkit-filter and filter properties to invert(1) to invert the colors of the image.
To do the same thing with JavaScript, we write:
document.querySelector("img").style.filter = "invert(1)";
Conclusion
To invert the colors of an image in CSS, we can use the filter CSS property.
To invert the colors of an image in JavaScript, we can set the style.filter property of the element to the same value.