JSFiddle - React, Tailwind, and code Playground

HTML

<a class="pajzs" href="/html/code/">
				<span class="Pajzs">
					<span class="PajzsLeft">
					</span>
					<span class="PajzsMiddle">
						HTML
					</span>
					<span class="PajzsRight">
					</span>
					<span class="PajzsBottom">
					</span>
				</span>
			</a>

CSS

a.pajzs {
    width: 350px;
    font-family: Impact,Charcoal,sans-serif;
    height: 350px;
    display: block;
}
a.pajzs span{
	display: block;
}
.PajzsLeft {
	float: left;
	width: 0;
	border-left: 50px solid transparent;
	border-top: 300px solid #CE5937;
}
.PajzsMiddle {
	float: left;
	width: 250px;
	height: 230px;
	background-color: #CE5937;
	color: #FFF;
	text-align: center;
	padding-top: 70px;
	font-size: 80px;
}
.PajzsRight {
	float: left;
	width: 0;
	border-right: 50px solid transparent;
	border-top: 300px solid #CE5937;
}
.PajzsBottom {
	width: 0;
	height: 0;
	border-left: 125px solid transparent;
	border-right: 125px solid transparent;
	border-top: 50px solid #CE5937;
	clear: both;
	margin-left: 50px;
}