JSFiddle - React, Tailwind, and code Playground

by Koubenec

HTML

<div class="triangle"></div>

CSS

.triangle:before {
content: " ";
position: absolute;
width: 0px;
height: 0px;
border-style: solid;
border-width: 0 20px 20px 0;
border-color: transparent blue transparent transparent;
}
.triangle:after {
content: " ";
position: absolute;
left: 27px;
width: 0px;
height: 0px;
border-style: solid;
border-width: 20px 20px 0 0;
border-color: red transparent transparent transparent;
}