Background Image Blur plugin is a cross-browser jQuery plugin for blurring images.

It was designed as an efficient way to create pleasant backgrounds for HTML pages containing images or video. I developed the plugin for NBC News video page where it blurs video’s thumbnail and places it in the background as ambient back drop. Reusing existing images that are already downloaded by the browser conserves bandwidth and reduces page size while maintaining clean look. As for the size, the plugin is 1.5kb minified and gzipped which is much less than any image.

Under the hood it uses fast SVG filters on modern browsers and falls back to some IE specific filters for older version of Internet Explorer.

The plugin is on NPM, Bower and on Github.

Liked it? Take a second to support Maks Surguy on Patreon!