JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Блок с тенью</title>
        <style>
            body {
                font-family:arial;
            }
            
            #header {
                border-radius:8px 8px 0 0;
                border-style:solid;
                border-width:1px 1px 0;
                border-color:#a3d869;
                padding:3px 10px;
                background:#c9e39c;
                font-weight:bold;
                font-size:17px;
                margin-bottom:-1px;
                display:inline-block;
                max-width:250px;
                box-shadow:-1px -1px 2px #ccc, 1px -1px 2px #ccc;
            }
            
            #content {
                border-radius:0 0 8px 8px;
                border:1px solid #a3d869;
                background:#c9e39c;
                padding:10px;
                font-size:14px;
                height:100px;
                box-shadow:1px 1px 2px #ccc, -1px 1px 2px #ccc, -1px -1px 2px #ccc, 1px -1px 2px #ccc;
            }
        </style>
    </head>
    <body>
        <div id="header">Заголовок</div>
        <div id="content">Содержание блока</div>
    </body>
</html>