JSFiddle - React, Tailwind, and code Playground

by Laurent Dufour

HTML

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

CSS

.triangle {
  position: relative;
  background:#eee;
  border: 1px solid #AAA;
  height: 16px;
  width: 16px;
}

.triangle::before {
  content:"";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-style: solid;
  border-color: #000 transparent transparent;
  border-width: 5px 4px 0 4px;
}