JSFiddle - React, Tailwind, and code Playground
HTML
<div class="container">
<div class="target"></div>
<div class="target"></div>
<div class="target"></div>
<div class="target"></div>
<div class="target"></div>
<div class="target"></div>
</div>
CSS
.target {
width: 100px;
height: 100px;
border: 1px solid #000;
border-radius: 50px;
margin: 10px;
display: inline-block;
}
.container:hover .target {
transform: scale(0.9);
transition-timing-function: ease-in;
transition: 0.2s;
}
.container .target:hover {
transform: scale(1.1);
transition-timing-function: ease-in;
transition: 0.2s;
}