JSFiddle - React, Tailwind, and code Playground

HTML

<button>Hover</button>

<div class="wrap">
    
    
</div>

CSS

.wrap {
    width:100px;
    height:100px;
    border:1px solid grey;
    background-color: #bada55;
    margin-top: 25px;
    visibility:hidden;
    opacity:0;
    transition: visibility 0s linear 0.5s,
                opacity 0.35s linear;
}

button:hover + .wrap {
  visibility:visible; /* show it on hover */
  opacity:1;
  transition-delay:0; 
}