Background color gradient on scroll?

Hi there,

I'd like to add a background to my website that is similar to this example: https://www.ginlane.com/

I've managed to work out how to just add a background color gradient, but it isn't quite the effect I'm after and I'd more so like to add a gradient/color change that activates on scroll. As I will be using colors that don't necessarily gradate (as per the example above), I'm wondering if instead of looking for a gradient option I should be looking for an option that would offer a smooth transition between background colors instead?

I'm using the Mentor template, which is in the Brine family.

Any help or suggestions are greatly appreciated!

Thanks, Jessica