JSFiddle - React, Tailwind, and code Playground

by davidxmartins

HTML

<div> 
<span></span>
</div>

CSS

div {
  width: 100px;
  height: 100px;
  background: url(https://upload.wikimedia.org/wikipedia/commons/thumb/8/83/Circle-icons-tools.svg/1024px-Circle-icons-tools.svg.png);
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 1;
}
span {
  background: url(https://i.pinimg.com/564x/45/13/0a/45130a9d775c2aefcc124f96f69dbe9a.jpg);
  width: 100px;
  height: 100px;
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0;

}
div:hover span {
  opacity: 1;
  position: absolute;
}