<div class="box">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
body{
perspective: 1000px;
}
.box{
width: 900px;
height: 900px;
margin: 30px auto;
position: relative;
transform-style: preserve-3d;
}
.box div{
width: 900px;
height: 900px;
position: absolute;
}
.box div:nth-child(1){
top: -900px;
transform-origin: bottom;
transform: skew(20deg) rotateX(95deg);
background-color: aliceblue;
}
.box div:nth-child(2){
top: 900px;
transform-origin: top;
transform: skew(0deg) rotateX(-93deg);
background-color: aliceblue;
}
.box div:nth-child(3){
left: -900px;
transform-origin: right;
transform: skewY(-41deg) rotateY(-92deg);
background-color: antiquewhite;
}
.box div:nth-child(4){
left: 900px;
transform-origin: left;
transform: skewY(40deg) rotateY(92deg);
background-color: antiquewhite;
}
.box div:nth-child(5){
transform: translateZ(-900px);
background-color: beige;
}