JSFiddle - React, Tailwind, and code Playground

by Liam Hennessy

HTML

<div class="wrapper">
  <img src="//google.com/favicon.ico" />
</div>

CSS

.wrapper {
  background-color: orange;
  height:100px;
  overflow: hidden;
  width:100px;
}
.wrapper img {
  transform: perspective(500px) translate3d(0, 0, 0);
  transition: transform 0.5s;
  width: 100%;
}
.wrapper:hover img {
  transform: perspective(500px) translate3d(0, 0, 200px);
  transition: transform 0.5s;
}