JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrap">
  <div id="test"></div>
</div>

CSS

#wrap {width:300px;overflow:hidden;border-radius:0 10px 0 0;}
#test {
  width:300px;
  height:100px;
  border-radius:10px 0 0 0;
  background:black;
  transform:
    skew(-20deg)
    translate(30px, 0px);
}