Overlay image

Hey everyone,

I’d like to add a color overlay on my hero image
How can i do that ?


I believe you can use a solid bloc mask and colour/overlay accordingly.
Not at my Mac atm so can’t confirm.


I normally just use a pseudo class for that.

eg. If you added a custom class called .hero, also make .hero::before

I use the pseudo for the image and place the colour/gradient on the class.

But @TrevReav is a fantastic solution, easy too. :+1: :grin:

Go for his one, unless you want to animate the image or something.

1 Like

Thanks for the tips.
I’m gonna try your solutions…

Have a nice day

Is this what you are referring to?

Our BlocsMaster @Eldar, has a tutorial on this.

Hi @KBConcepts, yes it is. If you scroll down to the very bottom of the mask options, there’s a solid one and you can set your colour and opacity.


Thanks for bringing that to my attention. I never have scrolled down that far. :upside_down_face: