Design comparison
Solution retrospective
Hi,
I used background-blend-mode
for the hover effect on the image.
I think the color is not the same like the design but it is close.
Could you please let me know how you would have approached this?
Regards Milen
Community feedback
- @MikevPeerenPosted about 3 years ago
Hey there,
Good job on finishing this one.
You could've used the cyan color provided and added opacity 0.5 to it on hover, that should solve your problem.
Marked as helpful0 - @Ls6375Posted about 3 years ago
Add overlay div in the image container. div-container img div-overlay
set div-overlay postion abosolute top 0 left 0 and width 100% h= 100% and put img and background-color inside it ## set it's opcatity to 0 set div-container position relative
now on hovering the div-container sets the div-overlay opacity to 1
if you still can't understand to my repositry
https://github.com/Ls6375/Frontend-Projects_Frontend-Mentor/tree/main/4.%20nft-preview-card-component-main
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