JSFiddle - React, Tailwind, and code Playground

HTML

<div class="trap">
	Hello world
</div>

CSS

.trap {
	position: relative;
	height: 400px;
	width: 100%;
	background-color: #259
}
.trap:before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	height: 0;
	width: 0;	
	border-top: 40px solid #fff;
	border-right: 100vw solid transparent;
}

.trap:after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	height: 0;
	width: 0;	
	border-bottom: 240px solid #fff;
	border-left: 100vw solid transparent;
}