<body>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg">
  <filter id="blur">
    <feGaussianBlur stdDeviation="3" />
  </filter>
</svg>
<div id="blur-container">
    <img class="blur" alt="Tiger profile" src="http://tigerpictures-images.com/wp-content/uploads/2014/10/cartoon-tiger-pictures.jpg"></img>
    <img style="width:30%" alt="Tiger profile" src="http://tigerpictures-images.com/wp-content/uploads/2014/10/cartoon-tiger-pictures.jpg"></img>
</div>
</body>
#blur-container{
position:absolute;
  left:0px;
  top:0px;
}
img.blur{
	width:30%;
	-webkit-filter:blur(3px);
	-moz-filter:blur(3px);
	-ms-filter:blur(3px);
	filter:blur(3px);
	filter:url('#blur');
	progid:DXImageTransform.Microsoft.Blur(pixelradius=2);
	transition:.9s -webkit-filter linear;
}
body{
background-color:black;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.