JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    <head>
    </head>
    <body>
        <div class="container">
            <div class="back">1</div>
            <div class="front">2</div>
        </div>    
    </body>
</html>

CSS

.container{
                width : 500px;
                height: 300px;
                border: 1 px dotted black;
                margin: 30px auto;
                position: relative;
                -webkit-perspective: 1000;
            }
            .container div{
                position: absolute;
                width : 150px;
                height: 150px;
            }
            .container .back{
                background: blue;
                z-index: 2;
            }
            .container .front{
                background: yellow;
                z-index: 1;
                -webkit-transform: rotateY(-40deg) translateX(100px);
            }