JSFiddle - React, Tailwind, and code Playground

HTML

<a href='http://example.com'>
  <img src='http://lorempicsum.com/futurama/350/200/1'>
</a>

CSS

a { position: relative; display: inline-block; }
a:hover:before {
  content:""; 
  position: absolute;
  left: 0; right: 0; bottom: 0; top: 0;
  background:url("http://lorempicsum.com/futurama/255/200/2") no-repeat #fff;
}