JSFiddle - React, Tailwind, and code Playground

HTML

<div id="rectangle">
  <div id="triangle-down"></div>
  <div id="triangle-left"></div>
</div>

CSS

#rectangle {
  width: 400px;
  height: 200px;
  background-color: red;
  margin-top: 25px;
  position: relative;
}
#triangle-down {
  border-left: 30px solid red;
  border-right: 0;
  border-top: 200px solid transparent;
  position: absolute;
  right: -30px;
  top: 0;
}
#triangle-left {
  border-top: 0;
  border-bottom: 15px solid red;
  border-right: 400px solid transparent;
  position: absolute;
  right: 0;
  top: -15px;
}