JSFiddle - React, Tailwind, and code Playground

HTML

<div id="primeiro"><div id="segundo"></div></div>

<div id="efeito">sd</div>

CSS

#primeiro{
  width: 300px;
  height: 300px;
  background: red;
   float: left; 
}
#segundo{
  width: 150px;
  height: 150px;
  background: green;
  margin: auto; 
}
#efeito{
  width: 90px;
  height: 90px;
  background: pink;
  float: left; 
}
#primeiro:hover ~ #efeito {
    background: blue
}