JSFiddle - React, Tailwind, and code Playground

by csswizardry

HTML

<hr class=style-six>

CSS

body{
    padding:50px;
    background-color:#333;
    color:#fff;
}

hr.style-six{
    margin:0 auto 24px;
    padding:0;
    border:none;
    border-top:medium double #fff;
    color:#fff;
}
    hr.style-six:after{
        content:"§";
        display:block;
        text-align:center;
        font-size:1.5em;
        line-height:0.75;
        margin-top:-0.5em; /* Pull it back up by half. */
    
        text-shadow:1px 0 0 #333,-1px 0 0 #333,2px 0 0 #333,-2px 0 0 #333,3px 0 0 #333,-3px 0 0 #333; /* Same colour as page's background. */
    }