Color Overlay Scroll

In this tutorial, you will learn to apply a color overlay with CSS that fades on page scroll down. Watch the video below for a detailed tutorial.


    <div class="container"></div>


body {
	margin: 0;
	height: 1500px;
	background-image: url('');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	background-attachment: fixed;
.container {
	height: 100%;
	background: linear-gradient(#3b8dcf, transparent 80%);
	mix-blend-mode: difference;