JSFiddle - React, Tailwind, and code Playground

HTML

<div class="opa">
    <h2 class="t1">Заголовок</h2></div>
<div class="t2">текст вкладки</div>

CSS

h2 {margin:0;} 
div {margin:0;padding:0;border:0;}
.t1 {padding:5px 10px;font-weight:bold;font-size:16px
    max-width:250px;background-color:#c9e39c;border:2px solid #a3d869;border-bottom:none 0;z-index:10;display:inline-block; border-radius: 10px 10px 0 0;text-align:center;position:relative;

} 
.opa {max-width:250px;font-size:16px;font-weight:bold;line-height:1.7;position:relative;display:inline-block;
    border-radius: 10px 10px 0 0;box-shadow: 0 -1px 10px black; /* Параметры тени */ -moz-box-shadow: 0 -1px 10px rgba(0,0,0,0.5); /* Для Firefox */ -webkit-box-shadow: 0 -1px 10px 0 rgba(0,0,0,0.5); /* Для Safari и Chrome */ } 

.t2{background:#c9e39c;border-radius: 0 0 10px 10px;border: 2px solid #a3d869;padding:15px;box-shadow: 0 0 10px black;
-moz-box-shadow: 0 0 10px rgba(0,0,0,0.5); /* Для Firefox */
-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5); /* Для Safari и Chrome */
  position:relative;z-index:1;
    top:-2px;
}