Gradient overlay and tweaking start and end %

Plugin Support


Hi @cwarrent!

We don’t have an option for that, but you could use a custom CSS like this:

#n2-ss-70 .n2-ss-slide-background-color {
  background: linear-gradient(to bottom, RGBA(255,0,0,1) 0%, RGBA(53,124,189,1) 20%) !important;

Where 70 should be replaced by the ID of you slider:
and adjust the colors and percentages as needed.

Also, please note that we cannot provide support for custom coding, so if you need further modifications, that needs to be written by you.

With a bit of tweaking, that code worked really well, so massive thanks for that Robert.

In case it helps others, I’ve added my amends below. I changed the ID to 3, then chose black values at 100% (0,0,0,1) and then with 0% transparency RGBA(0,0,0,0).

n2-ss-3 .n2-ss-slide-background-color {
background: linear-gradient(to bottom, RGBA(0,0,0,1) 0%, RGBA(0,0,0,0) 20%) !important;


This site will teach you how to build a WordPress website for beginners. We will cover everything from installing WordPress to adding pages, posts, and images to your site. You will learn how to customize your site with themes and plugins, as well as how to market your site online.

Buy WordPress Transfer