<div></div>

div {
	--gt: linear-gradient(black, black);
	--n: 100px;

	width: 500px;
	height: 500px;
	background: 
		var(--gt) top right, 
		var(--gt) top var(--n) right,
		var(--gt) top calc(var(--n) * 2) right, 
		var(--gt) top calc(var(--n) * 3) right,
		var(--gt) top calc(var(--n) * 4) right, 
		palegreen;
	background-repeat: no-repeat;
	background-size: 60%, 90%, 70%, 40%, 10%;
}

body  {
	display: grid;
	align-items: center;
	justify-items: center;
	height: 100vh;
	margin: 0;
}
@media (max-width:500px){
	div {
		width: 90vw;
		transform: scale(.9);
	}
}