JSFiddle - React, Tailwind, and code Playground
HTML
<div class="wrapper">
<section class="blue">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus libero unde harum, ab, rerum suscipit repellendus quas, dolorum sequi animi, facere. Rerum aut ab sint tenetur mollitia dignissimos, ad commodi.
</section>
</div>
CSS
.wrapper {
width: 700px;
margin: 0 auto;
}
section {
margin-top: 50px;
position: relative;
padding: 30px 20px;
box-sizing: border-box;
}
section:before,
section:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
section:before {
background-color: lightblue;
transform: rotate(5deg) skew(5deg);
}
section:after {
background-color: CornflowerBlue;
transform: rotate(4.5deg) skew(4.5deg) translate(1px, 4px);
}