JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    <div class="box"></div>
</div>

CSS

.box {
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: scaleZ(10) translateZ(1px);
    -moz-transform: scaleZ(10) translateZ(1px);
    -ms-transform: scaleZ(10) translateZ(1px);
    -o-transform: scaleZ(10) translateZ(3px);
    transform: scaleZ(10) translateZ(1px);
    width: 100px;
    height: 100px;
    display: block;
    background:red;
}
.wrapper {
    width:400px;
    margin:50px auto;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: rotateY(-35deg) rotateX(-15deg) rotateZ(8deg);
    -moz-transform: rotateY(-35deg) rotateX(-15deg) rotateZ(8deg);
    -ms-transform: rotateY(-35deg) rotateX(-15deg) rotateZ(8deg);
    -o-transform: rotateY(-35deg) rotateX(-15deg) rotateZ(8deg);
    transform: rotateY(-35deg) rotateX(-15deg) rotateZ(8deg);
    -webkit-transform-origin: center center;
    -moz-transform-origin: center center;
    -ms-transform-origin: center center;
    -o-transform-origin: center center;
    transform-origin: center center;
}