JSFiddle - React, Tailwind, and code Playground

HTML

<div class="grid">
	<div>item-1</div>
	<div>item-2</div>
	<div>item-3</div>
	<div>item-4</div>
</div>

CSS

.grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(100px, 200px));
	grid-gap: 20px;
}

.grid div {
	background-color: #28314E;
	border: 1px solid #212941;
	border-radius: 5px;
	padding: 8px 15px;
	color: #ffffff;
	font-size: 18px;
	font-family: roboto;
}

.grid div:nth-child(odd) {
	background-color: #475477;
}