Blog card with hover effect

Hello ! Very nice work, you're near pixel perfect :)

You wanted tips on bad practices you might have, here's what i've noticed :

• css : don't use values when naming your variables (yellow, etc.), but instead, use a term describing the role of the variable (main-color, bg-color, title-font) etc. That way, if someday, you have to change the value of your variables, you don't have to rename it and avoid having a variable "yellow" containing an hex code for red.
• html : avoid div if you can, there are a lot of other tags you can use : article, section, header, footer, etc. divs are not very good from a SEO point of view.
• try to store your svg data into a dedicated file : it makes your code cleaner. Good habit to have : if you have one element or function you might want to use elsewhere : put it in a separate file.

Some other tips :

• you can put other values than colors in your variables : font, size, etc.
• try to avoid fixed height and width for element whose size might change : your element will better adapt to its content.
• you can use numeric values in font-weight : 100, 200, etc. It allows you to be more precise than using values like bold, etc.

Hope it helps :)

Very nice work on the transition btw !