All comments

• 

  Carlos Guzman• 285

  @guztrillo

  Submitted almost 3 years ago

  I couldn't figure out how to match the image overlay color , so I did my best.

  Edit: Thanks to Moises in the comments, I fixed the image overlay color using the property mix-blend-mode, which I didn't know until this.

  To achieve this I changed the HTML code a little using srcset, because I was using background-image with media queries to change the image.

  

  Stats preview card component solution using SASS and CSS Grid

  1

  6

  0

  

  Moises• 60

  @devmoises

  Posted almost 3 years ago

  Hello @Carlos Guzman, good job!, to apply the image overlay color you can do it by adding the color to a pseudo-element of the parent of the image ".content_img: before {background-color: hsl (277, 64%, 61%)}" and to the image to apply " .img {mix-blend-mode: multiply;} ". Don't forget that the pseudo-element has more properties to make it work like: content = "", position = "absolute", etc.

  0

  This comment has received 1 replyShow