Image overlay is a particularly cool feature if you want to create consistency throughout your website in terms of your color and theme styling. This has always been available for background images and also now for normal images to do that. Simply click on the image and then you will see from the toolbar. You have the option now for the overlay. Let’s apply.

Let’s say we also go for an orange, but naturally this is not what we want to achieve: grab the opacity slider and drag it down. Orange here is probably not a very good example, because we want to have something: that’s a little bit contrasting to the background. So I’ll drag my used slider to that green that i saw there perfect. This looks really good and then I’m just going to copy the hex color. What we do now is we go to the other images and we also apply the same overlay and we reduce it also a little bit.

This is one route you can go, but the other one i really like is to actually use it as a gradient to do that. Let’s select this image, and now, instead of using none under overlay, you can go for a solid, which is what we’ve been doing or gradient. Now the gradient gives you this slider, where you can choose between the two options that you want to use i’ll click on this screen and first i will paste that code that we’ve used to get the green that we want. While it is still fully opaque. I will set the direction.

I want my gradient to appear I’ll type in the 135, which will give me the white year in the top and then the green year at the bottom. You can also choose to set it to radial if you rather wish to have that effect. I’ll put it back on linear and what I’m going to do now is. I will make sure that my color on the left is set to something like white or i can choose another color that is complementary to the color scheme that i’m using, but i’m going to keep it on white and i’ll grab my opacity slider and drag it Down, like so aha looks really good. Now the question is: how do i replicate this each and every time for every other image on my page, instead of doing that manually, i can simply right.

Click on the image select copy, select the next image. I want to apply that to right click and say paste styles. Without a mess and without a fuss we’ve just created a nice look for our website, give the overlay for images as spin and for more tutorials. On how to’s features and updates make sure you subscribe to this YouTube channel also visit us at Brizy until next time.