JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<div class="container">
			<div id="carousel" class="carousel slide" data-ride="carousel">
				<div class="carousel-inner">   <!-- Wrapper for slides -->
					<div class="item active back_img" style="background-image:url('http://www.pluots.net/media/full/18/dining-table-contemporary-in-wood-home-fred-by-vladimir-dining-table-contemporary-in-wood-home-fred-by-vladimir.jpg');">
					  <img class="front_img" src="http://www.pluots.net/media/full/18/furniture-tips-to-make-marvellous-round-dining-table-furniture-tips-to-make-marvellous-round-dining-table.jpg"/>
					  <div class="carousel-caption">
						  <h3>Image1</h3>
					  </div>
					</div>
					<div class="item back_img" style="background-image:url('http://www.pluots.net/media/full/18/dining-table-contemporary-in-wood-home-fred-by-vladimir-dining-table-contemporary-in-wood-home-fred-by-vladimir.jpg');">
					  <img class="front_img" src="http://www.pluots.net/media/full/18/furniture-tips-to-make-marvellous-round-dining-table-furniture-tips-to-make-marvellous-round-dining-table.jpg" />
					  <div class="carousel-caption">
						  <h3>Image2 </h3>
					  </div>
					</div>
					<div class="item back_img" style="background-image:url('http://www.pluots.net/media/full/18/dining-table-contemporary-in-wood-home-fred-by-vladimir-dining-table-contemporary-in-wood-home-fred-by-vladimir.jpg');">
					  <img class="front_img" src="http://www.pluots.net/media/full/18/furniture-tips-to-make-marvellous-round-dining-table-furniture-tips-to-make-marvellous-round-dining-table.jpg" />
					  <div class="carousel-caption">
						  <h3>Image 3</h3>
					  </div>
					</div>
				 </div>

				 <!-- Controls -->
				  <a class="left carousel-control" href="#carousel" role="button" data-slide="prev"><span class="glyphicon...

CSS

.back_img{
	background-repeat: no-repeat;  
	background-size: 100% 160%;
	-webkit-filter: blur(2px);
	-moz-filter: blur(2px);
    -o-filter: blur(2px);
    -ms-filter: blur(2px);
	filter: blur(2px);
	z-index: -1;
}
.front_img{
	-webkit-filter: blur(-5px);
	-moz-filter: blur(-5px);
    -o-filter: blur(-5px);
    -ms-filter: blur(-5px);
	filter: blur(-5px);
	z-index: 9999;
   
}