JSFiddle - React, Tailwind, and code Playground

by ZeNz0r

HTML

<div class="left-arrow"></div>
<div class="right-arrow"></div>
<div class="down-arrow"></div>
<div class="up-arrow"></div>

CSS

.left-arrow {
	border-color: transparent black;
	border-style: solid;
	border-width: 20px 20px 20px 0px;
	height: 0px;
	width: 0px;
}

.right-arrow {
	border-color: transparent black;
	border-style: solid;
	border-width: 20px 0px 20px 20px;
	height: 0px;
	width: 0px;
}

.down-arrow {
	border-color: black transparent;
	border-style: solid;
	border-width: 20px 20px 0px 20px;
	height: 0px;
	width: 0px;
}

.up-arrow {
	border-color: black transparent;
	border-style: solid;
	border-width: 0px 20px 20px 20px;
	height: 0px;
	width: 0px;
}