Stats preview card component main use html css

Hello! 👋

Your solution looks great and matches the design. Great job! 👏

I might have a few suggestions for you to improve it:

• You can add the website's image as part of the markup instead of using it as background image since it can provide context for people who use screen readers.
• You can use the ::after pseudo-element for the purple effect on the image instead of an empty div. It is a good practice to not have empty divs in our websites.
• Try to build the website using the Mobile First approach since nowadays websites need to also work for small screen devices.
• For your card, you can set a max-width instead of a normal width. That way, you allow it to shrink for small devices and cannot grow more than the max-width value you set.
• You can use grid for the desktop layout since grid is often used for layout purposes while flexbox is used more for individual components.
• For the Stats section, you can use an unordered list with 3 list items having 2 paragraphs inside. That way your markup is more semantic.
• Try to avoid nesting and use only inline elements inside headings.
• To make the picture color look like the design, you can use the mix-blend-mode property with a value of multiply.

Hope this information helped you! 😊

Happy coding!