JSFiddle - React, Tailwind, and code Playground

by alessia_fachin

HTML

<div>
    <img src="http://www.repubblica.it/images/2012/04/20/194818932-c709b1ed-c7ed-4876-9918-0b28877a9238.jpg"/>
<img src="http://cdn2.stbm.it/zingarate/gallery/foto/spettacolari-foto-di-natura-le-immagini-del-national-geographic-traveler/portrait-of-one-chilled-out-kangaroo.jpeg"/>
</div>

CSS

body{
    -webkit-perspective:500px;
    -webkit-transform-style:preserve-3d;
}

img {
    width:200px;
    -webkit-backface-visibility:hidden;
    position:absolute;
}

img:nth-child(2) {
    -webkit-transform: rotateY(180deg);
}

div {
    width:200px;
    transition: all 0.5s;
    -webkit-transform-style:preserve-3d;
    position:relative;
}

div:hover {
    -webkit-transform: rotateY(180deg);
}