Stats preview card

👾Hello Emanuel, congratulations for your new solution!

Your image is get distorted and to fix that you need to make your image fully responsive add display: blockand max-width: 100% and object-fit: cover to make the image auto-crop when resizing inside the column:

img {
    display: block;
    object-fit: cover;
    max-width: 100%;
}

To have your image purple with the same overlay effect, you need to use mix-blend-mode to make this color blend between the image and the background-color of the container. See the steps below to apply to the img or picture selector:

img {
mix-blend-mode: multiply;
opacity: 75%;}

👋 I hope this helps you and happy coding!