Frontend Mentor - Stats preview card component solution

This is a solution to the Stats preview card component challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
• My process
  • Built with
  • Useful resources
• Author
• Acknowledgments

Overview

The challenge

Users should be able to:

• View the optimal layout depending on their device's screen size

Screenshot

Links

• Solution URL: https://www.frontendmentor.io/solutions/sass-flexbox-and-basic-html-PqBfpsydW
• Live Site URL: https://mackans95.github.io/FrontEndChallengeOne

My process

Built with

• Semantic HTML5 markup
• Flexbox
• Sass

Useful resources

• CSS filter generator by Barrett Sonntag - This helped me for when trying to fiddle with the background-colors of my images. The solutions didnt end up solving my issue, but still was a cool little thing and i thought i would share it.

Author

• Frontend Mentor - @mackans95

Acknowledgments

• Frontend Mentor - [@kristinalesnjakovic] (https://github.com/kristinalesnjakovic/Stats-preview-card-component) Got tons of help from looking though Kristina's solution regarding the colors on the image, as i was having a rough time playing around with filters, but they had used a nice litte property called: mix-blend-mode: multiply, that solved it perfectly.