JSFiddle - React, Tailwind, and code Playground
by HDL52
HTML
<div id="triangle"></div>
CSS
body,
html {
width: 100vw;
height: 100vh;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
}
#triangle {
width: 100px;
height: 100px;
background: red;
clip-path: polygon(0 0, 100% 0, 0 100%, 0 0);
transform: rotate(-90deg);
}