Brizy WordPressAnd Brizy Cloud – Opacity in the Colour Picker. A very standard feature in website design is to apply a color overlay, either to a background, a graphic or an image, and you’ve probably done this before. But let’s talk a little bit about opacity and transparency and what is the difference? I select this image within my gallery and when you work with the image you will see that you have the option here for colors or overlay. Select that and then overlay will be the color that is applied over that image. I’ll select this purple and by default it’s going to cover the entire image.

Now the image hasn’t disappeared. It is still in the background, but there is a solid full color applied over it. When a color is at full strength, it is a solid color and you can see nothing through to the background that is called opaque. We refer to this as opacity, So currently it is at a hundred percent opacity. The slider here on the right in the Color picker is where we can change the opacity and you can see next to this slider.

We have a nifty little tag there. That shows us at which level the opacity is currently at a hundred percent click hold and drag it down, and we have the percentages dropping down. You see we’re here at 59, 50, Etc and then all the way to zero. Once we reach zero, there is no overlay anymore. It is just the image.

The opposite of opacity, then, is transparencies note here in the Color Picker we have this drop down. Selector you have none solid and gradient and gradient will give you gradient colors to work with selecting none gives you no overlay the moment. I select any of these swatches as overlay observe what happens to this drop down. It goes to solid, and now, as I drag the opacity slider, it will remain solid to whatever percentage I put it until I drag it all the way to the bottom and it reaches zero and it will switch to none. If you apply an overlay to this image, let’s put it again on the purple and currently it’s at 43 percent.

Let’s put it on something like 50 And you want to also apply to the other images. Now you know that it is at 50 percent. We can go to the image this one and select it put it also on the same purple and reduce it to 50 to have them consistent