I've been using svg filters to achieve similar effects for sprites
<svg id="gray_calendar" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 48 48 48">
<filter id="greyscale">
<feColorMatrix type="saturate" values="0"/>
</filter>
<image width="48" height="10224" xlink:href="tango48i.png" filter="url(#greyscale)"/>
</svg>
<feGaussianBlur stdDeviation="10"/>
example.<image ...>
tag to apply it to any image or even use multiple images.