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 component

Jatin 30

@JatinSetti

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


Hello ,

I couldn't figure a way out of how to make the image like that purple ish color .

Community feedback

reza 60

@rezabox

Posted

hi jatin good job of this project can you change the background-image by use linear-gradiant and can ok

Marked as helpful

1
darryncodes 6,430

@darryncodes

Posted

Hi Jatin,

Nice work, really responsive - well done!

Give this a shot:

  • add mix-blend-mode: multiply; and display: block; (this prevents the little line appearing at the bottom of the image) to .desktop-image
  • add background-color: hsla(277, 64%, 61%); to .image-div
  • add overflow: hidden; to .container to make sure the border-radius is visible on all corners

Hope it helps!

Marked as helpful

1

Jatin 30

@JatinSetti

Posted

@darryncodes Hello ,

Thank you it worked .

0
Alexid-ID 110

@Alexid-ID

Posted

In my way, I use mix-blend-mode 🤔

Marked as helpful

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