JSFiddle - React, Tailwind, and code Playground

by Madalina Taina

HTML

<div></div>
<div class="div1"></div>
<div class="div2"></div>

CSS

div{
    width:100px;
    height:100px;
    background:teal;
    transform: skew(20deg, -30deg);
    margin:50px;
}
.div1{
    width:100px;
    height:100px;
    background:#cddc39;
    transform: skew(20deg, 0);
    margin:50px;
}
.div2{
    width:100px;
    height:100px;
    background:#3f51b5;
    transform: skew(-20deg, 0);
    margin:50px;
}