JSFiddle - React, Tailwind, and code Playground

HTML

<section></section>

CSS

section{
		  width: 100%;
      height: 199px;
			background-color: skyblue;
			position: absolute;
      top: 50%;
      transform: translateY(-50%);
		}
		section::after,
		section::before{
			content: '';
			position: absolute;
			width: 100%;
			left: 0;
			height: 20px;
			background-color: pink;
		}
		section::after{
			top: -20px;
		}
		section::before{
			bottom: -20px;
		}