Scrolling Gradient

If you want a gradient that changes as you scroll down a very long page, you can create a gradient with a bunch of color stops, apply it to the body and it will do just that.

But, what if you don't want a perfectly vertical gradient? Like you want just the top left corner to change color? Mike Riethmuller, re-using his own technique from the CSS-only scroll indicator (A-grade CSS trickery), did this by overlapping two gradients. The "top" one is fixed position and sort of leaves a hole that another taller gradient peeks through from below on scroll.

Direct Link to Article — Permalink

The post Scrolling Gradient appeared first on CSS-Tricks.

from News Aggregator - Top News Stories From Your Favourite News Source | News Vally https://ift.tt/2zDM21S