5+ Pixelate and Image Blur jQuery Plugins

Sam Deering

In this post we are sharing with you 5+ Pixelate and Image Blur jQuery Plugins. They are mostly lightweight and easy to use with your images to get your that “blurred lines” effect. Check’em out!

1. pixelate.js

Is a simple library and jQuery plugin to pixelate any set of images and optionally reveal them on hover.

Pixelate-JS1.jpg
SourceDemo

2. Vague.js

An experimental script that allows you to blur any kind of html element thanks to the SVG filters

Vague-JS.jpg
SourceDemo

3. Foggy

A jQuery plugin for blurring page elements. It supports IE (8 and up), Firefox, Safari and Chrome.

Foggy.jpg
Source + Demo

4. blur.js

A jQuery plugin that produces psuedo-transparent blurred elements over other elements

blur-JS.jpg
SourceDemo

5. Hoverizr

A really small (2.5KB minified) responsive jQuery plugin that outputs manipulated images on top (or below) your targeted images.

Hoverizr.jpg
Source + Demo

6. StackBlur

A fast, almost Gaussian blur for Canvas by Mario Klingemann, Quasimondo.

StackBlur.jpg
Source + Demo

Win an Annual Membership to Learnable,

SitePoint's Learning Platform

No Reader comments

Comments on this post are closed.