Submitted over 2 years ago

stats preview card

Shannon• 50

@Shannerella

Preview site View code

This is a solution for...

Stats preview card component

HTML
CSS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

I can't get the hue quite right on the picture
In the media query I keep having this thin purple line under the picture no matter how I try to fit the content
My chrome screen does not go smaller than about 500px in width so it was a little hard to get the measurements right unless I pushed and tested every single change through my github page to my phone. Tips how to make that work easier would be helpful (VSCode extension?)

Community feedback

Gregg Christofferson• 295

@gchristofferson

Posted over 2 years ago

Hey @Shannerella 🙋‍♂️,

Great job, very well done!

Here's a suggestion to get the hue right on the picture.

on .right-picture change the background color to hsl(277, 60%, 61%);
on your image change the opacity to 0.75 and add mix-blend-mode: multiply.

That should get your image looking closer to the design. I hope that helps!

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