transparent background color and bg image

Like an overlay color over the image?

Not currently - there's no method for adding an overlay colors over a background image in CSS.

It would require some extra CSS to be added like this (not sure if it will work, just a though):

.site-header:before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: red;
    opacity: .6; 
    display: block;
}

.inside-header {
    position: relative;
    z-index: 1;
}

That assumes you're use the site header and not the Page Header add-on.

yes, like an overlay

the css does not work
i use the header with the navmenu float right

Can you link me to your site?

http://platform.sierink-wp.nl/

Try the adjusted CSS above: https://generatepress.com/forums/topic/transparent-background-color-and-bg-image/#post-181898

that does it, thanks

You're welcome :)

Hi Tom - I would like to have my content background color transparent, specifically
rgba(0, 14, 35, 0.6); however the customization area - Colors > Content > Background field does not accept that value. So, when I attempt to use the Simple CSS area this doesn't work either.

content {
background-color: rgba(0, 14, 35, 0.6);
}

Any suggestions?

Hi Cynthia,

on the color palette the second slider adjusts the transparency. Just adjust this and then the color field will become rgba - once done copy, highlight all the field and paste =)

David - Thank you for pointing out that 2nd slider....I've never noticed it there! LOL.

And BTW - I realized that I am able to enter the value: rgba(0, 14, 35, 0.6) but just without the ; at the end. The semicolon was making the field not accept the value.

The slider is definitely easier.

THANK YOU!!

You're welcome Cynthia