JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
    <head>
        <title>Эскиз</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <link rel="stylesheet" type="text/css" href="style.css" />
    </head>
    <body>
        <div id="wrapper">
            <div id="corner_1"></div>
            <div id="corner_2"></div>
            <div id="box">Рабочий эскиз</div>
            <div id="corner_3"></div>
            <div id="corner_4"></div>
        </div>
    </body>
</html>

CSS

html, body, div {
    margin:0;
    padding:0;
    background: transparent;
    outline: 0;
    border: 0;
}

#wrapper{
    margin: 10px;
    padding: 15px;
    position: relative;
}

#corner_1,
#corner_2,
#corner_3,
#corner_4{
    position: absolute;
    height: 15px;
    width: 15px;
    border: 1px solid #000;
}

#corner_1{
    border-left: 0;
    border-top: 0;
    top: 0;
    left: 0;
}

#corner_2{
    border-right: 0;
    border-top: 0;
    top: 0;
    right: 0;
}

#corner_3{
    border-left: 0;
    border-bottom: 0;
    bottom: 0;
    left: 0;
}

#corner_4{
    border-right: 0;
    border-bottom: 0;
    bottom: 0;
    right: 0;
}

#box{
    border: 1px solid #000;
    padding: 10px;
    background-color: #EFEFEF; 
}