JSFiddle - React, Tailwind, and code Playground

HTML

<body>

<div class="test">
Move mouse over me
</div>

</body>

CSS

.test {
  width: 100px;
  height: 100px;
  background-color: gray;
  opacity: 0.25;
  position: absolute;
  transition-property: opacity;
  transition-duration: 5s;
  display: table;
}

.test:hover {
  opacity: 1;
}