JSFiddle - React, Tailwind, and code Playground

by sol_b

HTML

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

CSS

.triangle-container {
  overflow: hidden;
  height: 100px;
}

.triangle {
  width: 100%;
  height: 100%;
  background-color: #0079C6;
  transform-origin: 0 100%;
  transform: rotate(45deg);
}

JavaScript

document.querySelector('.triangle').onclick = function() {
  this.style.display = "none";
}