Frontend Mentor - QR code component

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.

The project is hosted live on Netlify

Table of contents

Overview
My process
- Built with
- What I learned
Author

Overview

A simple single card component that displays the QR code.

Styles are built using vanilla CSS.

My process

Project set up
HTML
CSS

Built with

Semantic HTML5 markup
CSS custom properties
CSS Grid
CSS Flexbox
CSS logical properties
Mobile-first workflow

What I learned

Centering the elements using CSS Flexbox properties within a container.
Use 'rem' values instead of harcoded 'px' units
The exact working of margins and paddings for an element.

Author

Frontend Mentor profile - @Anand-Theertha
LinkedIn - @Anand Theertha