Image overlay in css

background: linear-gradient(0deg, rgba(0, 0, 0, 0.86), rgba(0, 0, 0, 0.86)), url(your-img-path);

Overlay color on image css

footer#site-footer{  
  position:relative;
}

footer#site-footer:before {     /* use before property (pseudo-element)  */
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.3);
}

Similar codes

14 votes299 views4 answers
How to create a strikethrough in css
CSS
25 votes309 views5 answers
Scroll animation css
CSS
0 vote285 views2 answers
Superscript css
CSS
61 votes290 views6 answers
Center text in css
CSS
0 vote261 views10 answers
BEST PLACE TO FIND CSS CODES
CSS
0 vote280 views3 answers
Howto stop the screen from zooming in when I click on input tag on mible
CSS
4 votes353 views1 answer
Css add dots if text too long
CSS
8 votes277 views2 answers
Horizontal align icon css
CSS
0 vote288 views1 answer
Media queries import file
CSS
16 votes292 views2 answers
Center h1 css
CSS