JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
 <html>
 <head>
 <title>Title of the document</title>

	<style>
		


	</style>
 </head>



 <body>
	
	<div style="margin-left:40px; margin-top:40px;" class="box3" >
		<div class="box2">
			<div class="rotate20 whiteonred box">
				Bestel nu!
			</div>
			<div class="box4">
			</div>
			<div class="box5">
			</div>
		</div>
	</div>
 </body>

 </html>

CSS

.rotate20
{

    -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.93969262, M12=0.34202014, M21=-0.34202014, M22=0.93969262,sizingMethod='auto expand')";
    filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.93969262, M12=0.34202014, M21=-0.34202014, M22=0.93969262,sizingMethod='auto expand');

    -moz-transform:  matrix(0.93969262, -0.34202014, 0.34202014, 0.93969262, 0, 0);

    -webkit-transform:  matrix(0.93969262, -0.34202014, 0.34202014, 0.93969262, 0, 0);

    -o-transform:  matrix(0.93969262, -0.34202014, 0.34202014, 0.93969262, 0, 0);
}

.whiteonred
{
	background:red;
	color: white;
	font-weight:bold;
}
.box
{
	display:inline-block;
	position:relative;
	right:-90px;
	top: -50px;
	width:120px;
}

.box2
{
 	width: 0; height: 0; border-top: 100px solid transparent; border-right: 240px solid red; 
}

.box3
{
    	position:absolute;
	border-bottom:10px solid white;
	border-radius:10px;
	
}

.box4
{
    	position:absolute;
	bottom:0px;
	right:0px;
	width:10px;
	height:10px;
	background-color:white;
}
.box5
{
    	position:absolute;
	bottom:0px;
	right:0px;
	border-bottom:10px solid red;
	border-right:10px solid red;
	border-radius:10px;
	width:40px;
	
	height:40px;
}