For the Horizontal Slider and Slider with scroll layout, there is no inbuilt customization of overlay color however you can manage this with the help of CSS override.
Follow these steps to add the overlay color:
- Copy the entire CSS override mentioned below:
<style>
#frame .slidee li {opacity: 1;}
#frame .slidee li.list-active:after {background: none;}
#frame .slidee li:after {
background: #000000d1;
display:flex;
content: "";
position: absolute;
top: 0;
width: 100%;
z-index: 9;
height: 100%;
transition: all 1s ease-out;}
</style>- After copying the relevant code, go to Settings (1).
- In the External Scripts (2), paste the code in the <body> section (3).
- Hit the Save (4) button to save the changes in the studio.
Now, refresh the site to review the changes on the live site.