Utilizando os pseudo-elementos `:after` e `:before`: Na sua necessidade talvez seja necessário adaptar o código alterando os valores de `top`, `left` e `rigth` até atingir o efeito que deseja <!-- begin snippet: js hide: false --> <!-- language: lang-css --> div{ width: 0; height: 0; top:40px; left:50px; position: relative; border-style: solid; border-width: 100px 130px 0 130px; border-color: #000000 transparent transparent transparent; } div:before { content: ""; display: block; position: relative;; border-top-left-radius: 100px; border-top-right-radius: 100px; width: 200px; height: 50px; background-color: white; right: 220px; top: -80px; } div:after { content: ""; display: block; position: relative; border-top-left-radius: 100px; border-top-right-radius: 100px; width: 200px; height: 50px; background-color: white; left: 20px; top: -130px; } button{ width: 400px; height: 80px; display: block; position: absolute; left: 0px; background: rgb(0, 0, 0); border-radius: 70px; } <!-- language: lang-html --> <button></button> <br/> <div></div> <!-- end snippet -->