JSFiddle - React, Tailwind, and code Playground

HTML

<div class="figure-container">
  <div class="figure"></div>
  <div class="top"></div>
  <doiv class="right"></doiv>
</div>

CSS

body{
  background:white;
}
.figure-container{
      width: 500px;
    height: 200px;
    position: relative;
    overflow: hidden;
}
.figure{
  background:yellow;
  width:100%;
  height:100%;
}
.right{
    background: white;
    height: 110%;
    width: 10%;
    position: absolute;
    top: 0px;
    right: -30px;  
    transform: rotate(10deg);
}
.top{
    background: white;
    height: 15%;
    width: 102%;
    position: absolute;
    left: -2px;
    top: -17px;    
    transform: rotate(-3deg);
}