Shimmer Mouseover Buttons HTML5 & CSS

It’s no secret that I’m a huge zombie fan. If you can’t tell I post about them fairly regularly. At any rate, this is a resource for making buttons that shimmer on hover and all that’s required is some CSS and HTML5 to create your own mouseover buttons that shimmer.

This effect can be added to any transparent png or svg that you want. Mouse over the zombie nurse below to see it shimmer like chrome in the sun.

The effect is created by layering identical images over each other then animating the white blur as a mask. The white blur can be any color you like by simply altering the RGB values on line 37 and 38 below.

See the Pen Rollover Gleam by Nate Balcom (@nbalcom) on CodePen.