Stats preview card component

Community feedback

• 

  Fer•3,970

  @fernandolapazPosted over 1 year ago

  Hi 👋🏻, regarding your comment:

  • You could use the mix-blend-mode property that specifies how an element's content should blend with its direct parent background, like this:

  .img__container {
  background-color: var(--Soft-violet-accent);
  }
  
  .img__container img {
  mix-blend-mode: multiply;
  opacity: 0.75;
  }
  

  I hope it’s useful,

  Let me know if it worked : )

  Regards,

  Marked as helpful

  1

  ---

  

  yas•390

  @yosrajalaliPosted over 1 year ago

  Hi..yesss it worked thank you so much@fernandolapaz

  1
• 

  hitmorecode•6,680

  @hitmorecodePosted over 1 year ago

  Congratulations well done, looks good. You can adjust the break point for mobile to 1110px. There is no problem with the overlay, you could also done it with a before pseudo element.

  Marked as helpful

  1

  ---

  

  yas•390

  @yosrajalaliPosted over 1 year ago

  thanks a lot for putting time on this . the overlay that I made is completely different from the design. I'm looking for a way to make it exactly the same @hitmorecode

  0

  

  hitmorecode•6,680

  @hitmorecodePosted over 1 year ago

  @yosrajalali the one in the challenge is done with mix-blend-mode: multiply if you want to learn more about this check this link

  W3Schools - Mix-blend-mode

  0