JSFiddle - React, Tailwind, and code Playground

by Itay

HTML

<div></div>
<svg>
  <defs>
    <clipPath id="clipping">
        <polygon points="
             0 0, 202 0,
             202 36, 185 50, 202 64,
             202 102, 0 102" />
    </clipPath>
  </defs>
</svg>

CSS

body {
    background: #AABBCC;
}

svg {
}

div {
    position: relative;
    height: 100px;
    width: 200px;
    background: #EEE;
    clip-path: url(#clipping);
    border: 1px solid black;
}