Check out example codes for "how to darken background image with css". It will help you in understanding the concepts better.

Code Example 1

/* Answer to: "css darken background image" */

  You can use the CSS3 Linear Gradient property along with your
  background-image like the code shown below.

  Here's a link to the CSS4 Linear Gradient property:

#landing-wrapper {
  display: table;
  width: 100%;
  background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('landingpagepic.jpg');
  background-position: center top;
  height: 350px;

Learn ReactJs, React Native from