Frontend Mentor - QR code component solution

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.

Table of contents

• Overview
  • Screenshot
  • Links
• My process
  • Built with
  • What I learned
  • Continued development
• Author

Overview

Screenshot

Links

• Solution URL: Frontendmentor
• Live Site URL: Netlify
• Live Site URL: Github Pages

My process

Built with

• Semantic HTML5 markup
• CSS custom properties

What I learned

• I learnt how to use root selector in CSS

:root {
  --White: hsl(0, 0%, 100%);
  --Lightgray: hsl(212, 45%, 89%);
  --Grayishblue: hsl(220, 15%, 55%);
  --Darkblue: hsl(218, 44%, 22%);
}

• I learnt how to use Google fonts

<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
  href="https://fonts.googleapis.com/css2?family=Outfit:wght@400;700&display=swap"
  rel="stylesheet"
/>

body {
  font-family: "Outfit", sans-serif;
}

Continued development

• Time management
• Explore other Google font styles

Author

• Github - Aishat02
• Frontend Mentor - Aris
• Twitter - aishat_tijani