This is a solution to the QR code component challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
- Solution URL: Add solution URL here
- Live Site URL: Add live site URL here
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- Mobile-first workflow
I use CSS var to simplify define the colors inside variable like this
:root {
--white: hsl(0, 0%, 100%);
--light-gray: hsl(212, 45%, 89%);
--gray-blue: hsl(220, 15%, 55%);
--dark-blue: hsl(218, 44%, 22%);
}
And using them like this
a {
color: var(--light-gray);
text-decoration: none;
}
a:hover {
color: var(--white);
}
I don't use fancy technology like react and framworkes to maintain simplify and increase understanding of styling.
- Website - Add your name here
- Frontend Mentor - @yourusername