JSFiddle - React, Tailwind, and code Playground

by AntonLapshin

HTML

<header>
    <h1 id="logo">Header</h1>
</header>

CSS

header {
    
    width: 500px;
    height: 50px;
    margin: 5px;
    
    border: 1px solid #a80002;
    border-radius: 5px;
    background-image: -webkit-gradient(linear, center top, center bottom, from(#d5575b), to(#c43033));
    background-image: -webkit-linear-gradient(top, #d5575b, #c43033);
    background-image: -moz-linear-gradient(top, #d5575b, #c43033);
    background-image: -o-linear-gradient(top, #d5575b, #c43033);
    background-image: -ms-linear-gradient(top, #d5575b, #c43033);
    background-image: linear-gradient(to bottom, #d5575b, #c43033);
    -webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.14), inset 0 1px 0 rgba(255,255,255,0.21);
    -moz-box-shadow: 0 1px 0 rgba(255,255,255,0.14), inset 0 1px 0 rgba(255,255,255,0.21);
    box-shadow: 0 1px 0 rgba(255,255,255,0.14), inset 0 1px 0 rgba(255,255,255,0.21);
}

h1#logo
{
    margin: 5px;
    font-size: 20pt;
    Color: #109040;
    text-shadow: black 1px 1px 2px;
}