JSFiddle - React, Tailwind, and code Playground

HTML

<div class="d1 d"></div>
<div class="d2 d"></div>

CSS

.d{
    width: 100px;
  height: 100px;
  background-color:red;
  float:right;
}
.d1{
  transform: skewY(-20deg);
}
.d2{
  transform: skewY(20deg);
}