QR Code component using HTML and CSS

What are you most proud of, and what would you do differently next time?

I am proud of making it look as close to the design as possible. I wanted to use DRY code as much as I could and tried implementing that. Also I tried using relative units like rem for this challenge. Previously I only used px.

What challenges did you encounter, and how did you overcome them?

It was not that much complex of a challenge since this is only HTML and CSS and a simple layout but I wanted to use the BEM methodology that is popular to make code readable and reusable which I tried using.

What specific areas of your project would you like help with?

I know that the code is still not that optimized as it could be but I am open to see how else people have written code and what do you guys think about mine.

Just a small question about naming the variables in css. What is the standard way of naming them? Do we name them with component/function-wise or visual-wise. How do we name colors?