JSFiddle - React, Tailwind, and code Playground

HTML

<div class="block1"></div>
<br>
<div class="block2"></div>
<br>
<div class="block3"></div>

CSS

.block1 {
  width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-right: 500px solid #2a76a9;
	border-bottom: 4px solid transparent;
}

.block2 {
  width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-left: 500px solid #2a76a9;
	border-bottom: 4px solid transparent;
}

.block3 {
  width: 0;
	height: 0;
	border-top: 60px solid gray;
	border-right: 500px solid gray;
	border-bottom: 20px solid transparent;
}