Stats-Card-Component

👾Hello Vaibhav Singh, Congratulations on completing this challenge!

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 sites 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!

Hi Vaibhav,

Good job with completing this challenge!

If you don't mind, here's some improvements you can make:

Accessibility issues: This has an easy fix, rather than using <h5>, try to just increase the value by one and then change the font-size in styles.css.

Purple Filter I was also not able to figure out how to add the purple filter overlay to the image, if you figure out how to do this please let me know!

Hope this helps, and let me know if you have any other questions.