<!-- https://css-tricks.com/snippets/css/css-triangle/ -->

<div class="triangle-isosceles"></div>
<div class="triangle-equilaterial"></div>
$size: 18px;

.triangle-isosceles {
   width: 0;
   height: 0;
   border-left: $size solid transparent;
   border-right: $size solid transparent;
   border-bottom: $size solid white;
}

// width is 0.866% of height
.triangle-equilaterial {
   width: 0;
   height: 0;
   border-left: $size solid transparent;
   border-right: $size solid transparent;
   border-bottom: calc(#{$size * 2} * 0.866) solid pink;
}

External CSS

  1. https://codepen.io/ozywuli/pen/RvZKaK

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js