Stats-preview-card-component

👾Hello Abdulbasit, congratulations for your new solution!

You're having trouble with the overlay effect you can fix that using mix-blend-mode and placing the component in the center, see the code fixes below:

Give the body the proper alignment:

body {
    display: flex;
    font-family: "Inter", sans-serif;
    background-color: hsl(233, 47%, 7%);
    font-size: 15px;
    min-height: 100vh;
    align-items: center;
    justify-content: center;
}

Proper overlay effect:

img {
mix-blend-mode: multiply;
opacity: 0.8;}

Here's my solution for this challenge if you wants to see how I build it: https://www.frontendmentor.io/solutions/stats-preview-card-vanilla-css-custom-design-text-animation-RfGBFlMpwK

👋 I hope this helps you and happy coding!