Design comparison
Solution retrospective
Could someone help with providing the violet overlay on images / changing the image between mobile and desktop optimized based on screen size?
Community feedback
- @mohsin316Posted about 3 years ago
Hey lewis! to apply the the purple background to the image you need to set the background image of that div to the image provided, then add "background-blend-mode: multiply;" or background-blend-mode: screen; to get the desired effect. also add a text align left to the first 2 paragrahs to get the final result for the desktop design.
Marked as helpful1 - @Nick331102Posted about 3 years ago
This is the easiest way I have found for the overlay.....
try using an inset box shadow
box-shadow: inset 0 0 0 1000px rgba(109, 54, 199, 0.596);
you can adjust the color.
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord