All comments

@Atharva-0710Submitted almost 2 years ago

Hello everyone, how can I add the light violet color to the image present in the website, I'm not able to figure out. Please help

Responsive Stats Preview Card using pure HTML and CSS

Clive Chambers•230

@Clive-ChambersPosted almost 2 years ago

I did something like this to make the image have a purple overlay effect. Let me know if this helps :)

<div class="office-img">
        <picture>
          <source media="(min-width: 415px)" srcset="./images/image-header-desktop.jpg">
          <img src="./images/image-header-mobile.jpg" alt="A picture of three women in an office">
        </picture>
</div>

.office-img {
    display: inherit;
    position: relative;
    max-height: 289px;
    background-color: hsl(277, 64%, 61%);
    
}

img{
    width: 100%;
    height: 100%;
    position: relative;
    background-size: cover;
    mix-blend-mode: multiply;
    opacity: 0.75;
}