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.

• Frontend Mentor - QR code component solution
  • Table of contents
  • Overview
    • Screenshot
    • Links
  • My process
    • Built with
    • What I learned
  • Author
  • Acknowledgments

Note: Delete this note and update the table of contents based on what sections you keep.

• Solution URL: https://github.com/rovicbalingbing/qrcode-frontendMentor.git
• Live Site URL: https://rovicbalingbing.github.io/qrcode-frontendMentor/

• Semantic HTML5 markup
• CSS custom properties
• Flexbox
• Media Query
• Google Fonts

In this challenge, I remember how hard the basics is. Even if it was just a fundamentals or basic syntax, it is really important to remember it all because sometimes, it might get hard for you to solve a problem just because you can't remember the right syntax of line of coded needed.

<div class="container">
    <div class="wrapper">
      <div class="qrcode-holder">
        <img src="images/image-qr-code.png" alt="QR code">
        <div class="text">
          <h1>Improve your front-end skills by building projects</h1>
          <h3>Scan the QR code to visit Frontend Mentor and take your coding skills to the next level</h3>
        </div>
      </div>
    </div>
  </div>

:root {
      --white: hsl(0, 0%, 100%);
      --light-gray: hsl(212, 45%, 89%);
      --grayish-blue: hsl(220, 15%, 55%);
      --dark-blue: hsl(218, 44%, 22%);
      --outfit: 'Outfit', sans-serif;
    }

If you want more help with writing markdown, we'd recommend checking out The Markdown Guide to learn more.

• Website - Rovic Balingbing
• Frontend Mentor - @rovicbalingbing
• Twitter - @roscidDreaming

I just want to thank Coder Coder from YT for recommending this Frontend Mentor as a source of front-end web development ideas.