Stats preview card component

Community feedback

• 

  Lucas 👾•104,400

  @correlucasPosted about 2 years ago

  👾Hello Kalhara, congratulations for your new solution!

  Answering your question:

  To make your hero image have the same look and the color purple overlay, you need to use mix-blend-mode using the multiply one.The mix-blend-mode CSS property sets how an element's content should blend with the content of the element's parent and the element's background.

  Here’s how you can add this to your img selector: img { mix-blend-mode: multiply; opacity: 84%;}

  Here's a good article explaining these effects with mix-blend-mode: https://developer.mozilla.org/en-US/docs/Web/CSS/mix-blend-mode

  ✌️ I hope this helps you and happy coding!

  1

  ---

  

  Kalhara Sandaruwan•190

  @ImpodaysPosted about 2 years ago

  @correlucas what is the best way to add image? add as a background in css file or add image in html file ?

  0

  

  Lucas 👾•104,400

  @correlucasPosted about 2 years ago

  @Impodays if the image it's just to decorate the page you can use it as background in the css, but if is something important like a product or anything related for a brand it's better img/picture because it's lmore likely to be found in search mechanism and also improve the SEO.

  0