@correlucas
Posted
Hello Orses, congratulations for your new solution!
I saw that you've applied mix-blend-mode: multiply to make the overlay effect with the image, in this case you miss only the opacity: 75% to reach the same color, note that you image is a bit strong. The color the container should have for a perfect blend should be the same color of the insight in the headline h1.
Hope it helps, happy coding?!
Marked as helpful
@orses
Posted
Thank you very much @correlucas for your words and for your help.
In what you comment on the image I used the color of the text insight and set aside the opacity in this way:
.card__media::after {
background-color: var(--color-accent); /* hsl(277, 64%, 61%) */
mix-blend-mode: multiply;
opacity: 0.75;
....
}
I don't know how to do the correction you suggest. I also tried directly using hsla(277, 64%, 61%, 0.75) and got the same result. I'll look at others' solutions to see if I'm able to fix it. Thank you very much! Cheers
