JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class ="w-b">
      
      <div class="sun">
        <p></p>
      </div>
      <div class="derevo">
       <div class="cvetok">
              
              <div class="lep h3"></div>
              <div class="lep h6"></div>
              <div class="lep h9"></div>
              <div class="lep h12"></div>
              <div class="lep h15"></div>
              <div class="lep h45"></div>
              <div class="lep h75"></div>
              <div class="lep h105"></div>
              <div class="korzinka"></div>
          </div>
         
         
      </div>
    </div>
    
</div>

CSS

.container{
width:1000px;
height:700px;
margin:0 auto;
background:black;    
}
/*Солнце*/
.sun{
position: relative;
z-index:4;
width:250px;
height:250px;
background:#ccc;
border:1px solid gray;
box-shadow:0px 0px 150px gray;
border-radius:50% 50% 50% 50%;
-webkit-transition:all 2s ease;
-o-transition:all 2s ease;
-moz-transition:all 2s ease;

}
.sun p{
position: absolute;
width:150px;
height:150px;
top:70px;
left:50px;
}
.sun:hover{
background:#ffff00;
box-shadow:0px 0px 300px yellow,0px 0px 100px orange;
}
.sun:hover~.derevo .list{
background:green;
}
.sun:hover~.derevo .cvetok .lep{
background:white;

}
.sun:hover~.derevo .cvetok .korzinka{
background:orange;
box-shadow:0px 0px 50px orange;
}
.sun:hover~.derevo .cvetok{
-webkit-transform:rotate(555deg);
-o-transform:rotate(555deg);
-moz-transform:rotate(555deg);
}

/*растение*/
.derevo{
margin-left:250px;    
}
.list{
width:100px;
height:150px;
background:gray;
border-radius:90px 10px 85px 10px;
-webkit-transition:all 3s ease 0.5s;
-o-transition:all 3s ease 0.5s;
-moz-transition:all 3s ease 0.5s;
    
}
.cvetok{
width:350px;
height:350px;
position:relative;
-webkit-transition:all 8s ease 0.5s;
-o-transition:all 8s ease 0.5s;
-moz-transition:all 8s ease 0.5s;    
}
.lep{
-webkit-transition:all 2s ease 1s;
-o-transition:all 2s ease 1s;
-moz-transition:all 2s ease 1s;    
position:absolute;
width:150px;
height:50px;
background:#CCC;
border-radius:1px 25px 25px 1px;
/*box-shadow:0px 0px 5px silver;*/
}
.korzinka{
box-shadow:0px 0px 50px gray;
-webkit-transition:all 2s ease 2.5s;
-o-transition:all 2s ease 2.5s;
-moz-transition:all 2s ease 2.5s;

   ...