Submitted almost 3 years ago

Mobile-first and responsive stats preview card component using flexbox

Nafis Arinda Rizky Putra Handoko• 60

@NafisHandoko

Preview site View code

This is a solution for...

Stats preview card component

HTML
CSS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

I'm still confused with image filtering. Using CSS, I still can't get an image filter that exactly matches the design. Any suggestion?

Community feedback

Anna Leigh• 5,135

@brasspetals

Posted almost 3 years ago

Congrats on submitting your first solution! 🎉

The coloring for this image was tricky, and you actually don't need to use the filter property at all! With your current setup, simply add mix-blend-mode: multiply to your img, and up the opacity from 0.5 to something around 0.8. 👍

Marked as helpful

Faris P• 2,810

@FarisPalayi

Posted almost 3 years ago

If you know the hex code of the color you want, then by using this tool, you can find the filter value of that color.

Marked as helpful

Please log in to post a comment

Join 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