Skip to content

Instantly share code, notes, and snippets.

@cooljl31
Forked from vishaltelangre/blur.css
Created December 29, 2017 21:31
Show Gist options
  • Save cooljl31/d36aef0e97fbf256f9fb8d9dfc7feb6b to your computer and use it in GitHub Desktop.
Save cooljl31/d36aef0e97fbf256f9fb8d9dfc7feb6b to your computer and use it in GitHub Desktop.
cross browser blur filter using css
.blur {
-webkit-filter: blur(3px);
-moz-filter: blur(3px);
-ms-filter: blur(3px);
-o-filter: blur(3px);
/* FF doesn't support blur filter, but SVG */
filter: url("data:image/svg+xml;utf8,<svg height='0' xmlns='http://www.w3.org/2000/svg'><filter id='svgBlur' x='-5%' y='-5%' width='110%' height='110%'><feGaussianBlur in='SourceGraphic' stdDeviation='5'/></filter></svg>#svgBlur");
filter: progid: DXImageTransform.Microsoft.Blur(PixelRadius = '3');
filter: blur(3px);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment