JSFiddle - React, Tailwind, and code Playground

HTML

<div class="arrow">|</div>

CSS

body,html{
    margin:0;
    padding:0;
    background-color:gray
}
.arrow{
    color:white;
    padding-left:35px;
    font-size:30px;   
    text-shadow:0 0 5px white,0 0 5px white;
}
.arrow:before{
    content:">";
    position:absolute;
    color:white;
    left:0px;
    top:3px;
    font-weight: bold;
    transform: scale(0.25,0.5);
}
.arrow:after{
    content:">";
    position:absolute;
    color:white;
    left:10px;
    top:3px;
    font-weight: bold;
    transform: scale(0.5,1)
}