Design comparison
SolutionDesign
Community feedback
- @soymzePosted 3 months ago
Great work, congrats! About the image filter, Set the container of the image to position: relative;. Use the ::before pseudo-element with position: absolute; to create the overlay. Set the background-color. Apply mix-blend-mode: multiply; to blend the overlay with the image. Ensure the z-index of the pseudo-element is higher than the image to appear on top.But make sure to use hsla with some transparecy so we can see the photo behind it.Happy coding:)
Marked as helpful0
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