JSFiddle - React, Tailwind, and code Playground

by Shanid

HTML

<div class="up"></div>
<p><p>
<div class="down"></div>
<p><p>
<div class="left"></div>
<p><p>
<div class="right"></div>

CSS

.up{
    border-width: 20px;
    border-style: solid;
    border-color: transparent transparent red transparent;
    width: 0px;
    height: 0px;
}
.down{
    border-width: 20px;
    border-style: solid;
    border-color: red transparent transparent transparent;
    width: 0px;
    height: 0px;
}
.left{
    border-width: 20px;
    border-style: solid;
    border-color: transparent red transparent transparent;
    width: 0px;
    height: 0px;
}
.right{
    border-width: 20px;
    border-style: solid;
    border-color: transparent transparent transparent red;
    width: 0px;
    height: 0px;
}