JSFiddle - React, Tailwind, and code Playground

by Sergey khorev

HTML

<!DOCTYPE html>
<html lang="en">

  <head>
    <meta charset="UTF-8">
    <title>Document</title>
  </head>

  <body>
    <div class="color">
      <div>
        <h1>ЗАГОЛОВОК</h1>
        <span>В самом примере через панель разрабочиков видно, что внутри тега P вложен SPAN, а в коде под примером вместо SPAN указан A.</span>
      </div>
    </div>
  </body>

</html>

CSS

body{
  background-color:#efeeee
}
.color{
  margin:25px;
  padding:25px;
  width: 450px;
  height: 250px;
  background-color:#efeeee;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 12px;
  box-shadow: -6px -6px 26px 0 rgba(255,255,255,0.83), 6px 6px 16px 0 rgba(217,210,200,0.51);
}

JavaScript

.col{
  box-shadow: -6px -6px 26px 0 rgba(255,255,255,0.83);
  }