JSFiddle - React, Tailwind, and code Playground

by thelifeisyours

HTML

<div id="card-1" class="card">
	<img src="https://i.imgur.com/tE6LjbQb.jpg" />
</div>
<div id="card-2" class="card">
	<img src="https://i.imgur.com/tE6LjbQb.jpg" />
</div>
<div id="card-3" class="card">
	<img src="https://i.imgur.com/tE6LjbQb.jpg" />
</div>
<div id="card-4" class="card">
	<img src="https://i.imgur.com/tE6LjbQb.jpg" />
</div>

CSS

body{
	background:transparent;
	display:flex;	
	flex-flow:row;
	justify-content:space-evenly;
	flex-wrap:wrap;
}

.card:hover ~ .card{
	filter:blur(3px);
}