JSFiddle - React, Tailwind, and code Playground
HTML
<button>button</button>
CSS
button {
border: 0 none;
background-color: red;
position: relative;
font-size: 4em;
margin-left: 100px;
}
button:before,
button:after {
content: '';
position: absolute;
background-color: inherit;
top: 0;
bottom: 0;
width: 1em;
z-index: -1;
}
button:before {
left: -0.5em;
-webkit-transform: skew(-10deg);
transform: skew(-10deg);
border-top-left-radius: 10%;
}
button:after {
left: auto;
right: -0.5em;
-webkit-transform: skew(10deg);
transform: skew(10deg);
border-top-right-radius: 10%;
}