JSFiddle - React, Tailwind, and code Playground
by toubia95
HTML
<img class="wp-image-423 filter" src="https://blog.frantext.fr/wp-content/uploads/2022/03/q-diff-distr-1024x640.png" alt="Comparer des distributions" width="690" height="431">
CSS
/* https://css-tricks.com/almanac/properties/f/filter/ */
.filter {
filter: opacity(0.7) grayscale(1);
transition: filter .5s;
}
.filter:hover {
filter: opacity(1) grayscale(0);
}
/* filter: opacity(0.7) grayscale(1);*/