I stumbled upon a quick video on YouTube on how to use the CSS3 grayscale filter when hovering on an image.
The results can be seen via this Codepen CSS3 Grayscale Filter
Click on the CSS tab in the Codepen example above to see how this filter effect can be implemented in your CSS.
“Method of applying filter effects (like blur, grayscale, brightness, contrast and hue) to elements, previously only possible by using SVG.” – Can I Use
“It’s worth noting that right now, CSS Filter Effects are an unoffical specification – however, the editors of the spec include representatives from Adobe, Apple and Opera, and we have already got implementations in Chrome, Safari and iOS 6.” – CSS3 Filters
Adeline Yaw - Happiness Engineer @ Automattic 