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

💥Animated Stats Preview Card Component💥

Saad Hisham 1,750

@Saad-Hisham

Desktop design screenshot for the Stats preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


👋 Hi there! I thoroughly enjoyed solving this challenge. I used Bootstrap to create the layout and added some animations using Framer Motion.💫 It was quite a challenge to match the color of the image with the design, but I did my best!

Community feedback

billccr 90

@billccr

Posted

Nice to see this challenge freshened up with some animation! Nicely done.

I believe I had used the css mix-blend-mode with the background color to get the image color.

Marked as helpful

1

Saad Hisham 1,750

@Saad-Hisham

Posted

Thank you so much, I really appreciate you letting me know about that CSS feature! I had no idea it existed until you mentioned it. I'm certain it will be quite useful for me going forward. Thanks again, @billccr! 😀

1
billccr 90

@billccr

Posted

So glad you found that helpful, Saad. There's a bunch of other modes that you can play around with while experimenting with other projects, too.

Here's the MDN page for them.

1

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