JSFiddle - React, Tailwind, and code Playground

by Neeraj

HTML

<div class="triangle-up"><span class="triangle-up-span">125</span>
</div>
<div class="triangle-up"><span class="triangle-up-span">1</span>
</div>
<div class="triangle-up"><span class="triangle-up-span">1255</span>
</div>
<div class="triangle-up"><span class="triangle-up-span">12</span>

</div>

CSS

.triangle-up {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 36px 38px 36px;
    border-color: transparent transparent #d30000 transparent;
    line-height: 0px;
    left:-10px;
    position:relative;
}
.triangle-up-span {
    text-align: center;
    line-height: 44px;
    position:relative;
    width: 38px;
    display: block;
    margin-left: -19px;
}