JSFiddle - React, Tailwind, and code Playground

HTML

<div class="cont">  
  <div class="block">
    <div class="block1">Наши проекты</div>
  </div>
 </div>

CSS

* {
        margin: 0;
        padding: 0;
        }
    body {
        width: 100%;
        background: #ddd;
        font-size: 15px;
        font-family: Arial;
        }
    .cont {
        box-shadow: 0 0 3px 5px rgba(208, 208, 208, 0.8);
        width: 600px;
        height: 600px;
        margin: 40px;
        z-index: -2;
        position: relative;
        }    
    .block {
        margin: auto;
        background: #F5F5F5;
        width: 100%;
        height: 100%;
        position: relative;
        }
    .block1 {
        position: absolute;
        height: 30px;
        width: 614px;
        top: 10px;
        left: -7px;
        background: #8F8F8F;
        text-indent: 20px;
        color: #fff;
        font-weight: bold;
        line-height: 30px;
        }
    .block1:before,.block1:after {
        display: block;
        width: 7px;
        height: 7px;
        position: absolute;
        background: #4D4D4D;
        }     
    .block1:before {
        content: "";
        bottom: -3px;
        left: 2px;
        z-index: -1;
        -moz-transform: rotate(30deg);
        -webkit-transform: rotate(30deg);
        -ms-transform: rotate(30deg);
        -o-transform: rotate(30deg);
        transform: rotate(30deg);
        }
    .block1:after {
        content: "";
        bottom: -3px;
        right: 2px;
        z-index: -1;
        -moz-transform: rotate(60deg);
        -webkit-transform: rotate(60deg);
        -ms-transform: rotate(60deg);
        -o-transform: rotate(60deg);
        transform: rotate(60deg);
        }