JSFiddle - React, Tailwind, and code Playground

by Abdul Ahmad

HTML

<div>

</div>

SCSS

div {
  position: relative;
  display: inline-block;
  width: 200px; 
  height: 50px; 
  background: tomato;
  margin: 50px;
  
  &::before {
    content: ''; 
    z-index: -1;
    position: absolute; 
    top: 5px; 
    right: calc(100% - 15px);
    border: 25px solid desaturate(darken(tomato, 15%), 35%);
    border-left-color: transparent;
  }
  
    &::after {
    content: '';
    z-index: -1;
    position: absolute; 
    top: 5px; 
    left: calc(100% - 15px);
    border: 25px solid desaturate(darken(tomato, 15%), 35%);
    border-right-color: transparent;
  }
}