JSFiddle - React, Tailwind, and code Playground

HTML

<div class="parent">
    <div class="children"></div>
    <div class="children"></div>
    <div class="children"></div>
</div>

CSS

.parent {
 width: 300px;
 height: 100px;
 background: lightgray;
}
.children{
 width: 70px;
 height: 70px;
 background: red;
 float:left;
  margin: 15px 0 0 20px;
}
.parent:hover > .children {
    background: green;
}

.parent > .children:hover {
    background: black;
}