How to draw curve in html and css

Question

I am trying to draw curve in html and css. I tried but not able to draw it correctly, Could someone please help me. I will attach a picture which I am trying to achieve.

Thanks

.box {
  width: 500px; 
  height: 100px;  
  border: solid 5px #000;
  border-color: #000 transparent transparent transparent;
  border-radius: 50%/100px 100px 0 0;
}

Answer 1

HTML

<span class="styling">Ali Haider</span>

CSS

.styling {
    border:none;
    background:green;    
    color:white;
    padding:15px 40px;
    text-transform:uppercase;
    cursor:pointer;
    clip-path: polygon(0 0, 100% 1%, 80% 100%, 0% 100%);
}