Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Stats Preview Card using Grid

Odalloc 170

@Odalloc

Desktop design screenshot for the Stats preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

Lucas 👾 104,420

@correlucas

Posted

👾Hi Odalloc, congrats on completing this challenge!

Great solution and great start! By what I saw you’re on the right track. I’ve few suggestions to you that you can consider to add to your code:

The way you’ve applied the purple color is fine, but if you want the exact color tone of color of the challenge designs, you need to use mix-blend-mode to make the color blend between the image and the background-color of the container. See the steps below to apply to the img or picture selector:

img {
mix-blend-mode: multiply;
opacity: 75%;}

✌️ I hope this helps you and happy coding!

Marked as helpful

1

Odalloc 170

@Odalloc

Posted

Hi @correlucas! Glad that my solution was on the right track. Still slow in coding but I'm happy for the progress. Thanks for your suggestions! I'll keep that in mind.

0

Please log in to post a comment

Log in with GitHub
Discord logo

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