Effect picture:
After adding class="filter" to the body
Use the grayscale function of the filter filter.
<style>
.filter {
-webkit-filter: grayscale(100%); /* webkit */
-moz-filter: grayscale(100%); /*firefox*/
-ms-filter: grayscale(100%); /*ie9*/
-o-filter: grayscale(100%); /*opera*/
filter: grayscale(100%);
filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); /*ie*/
filter: gray; /*ie9- */
}
</style>
<html class="filter">
<img src="https://cdn.pixabay.com/photo/2015/04/20/17/01/flower-731830_960_720.jpg" />
</html>