https://github.com/yashi-singh-1/qr-code-component

This repository showcases a responsive QR code component designed to enhance front-end skills through practical implementation. The project emphasizes clean, semantic HTML5 markup, modern CSS techniques, and mobile-first design principles.
https://github.com/yashi-singh-1/qr-code-component

css css3 frontend frontend-mentor frontend-mentor-challenge html html-css html5 html5-css3 html5css3 htmlcss qr-code-component qrcodecomponent

Last synced: about 2 months ago
JSON representation

This repository showcases a responsive QR code component designed to enhance front-end skills through practical implementation. The project emphasizes clean, semantic HTML5 markup, modern CSS techniques, and mobile-first design principles.

• Host: GitHub
• URL: https://github.com/yashi-singh-1/qr-code-component
• Owner: Yashi-Singh-1
• Created: 2024-07-28T17:42:17.000Z (5 months ago)
• Default Branch: main
• Last Pushed: 2024-07-30T12:13:22.000Z (5 months ago)
• Last Synced: 2024-07-30T20:44:23.531Z (5 months ago)
• Topics: css, css3, frontend, frontend-mentor, frontend-mentor-challenge, html, html-css, html5, html5-css3, html5css3, htmlcss, qr-code-component, qrcodecomponent
• Language: CSS
• Homepage:
• Size: 233 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
Frontend Mentor - QR Code Component Solution


This is a solution to the [QR code component challenge on Frontend Mentor](https://www.frontendmentor.io/challenges/qr-code-component-iux_sIO_H). Frontend Mentor challenges help you improve your coding skills by building realistic projects. 

Table of Contents




    
 

        

[Overview](#overview)

        


 [Screenshot](#screenshot)

        
 [Links](#links)



    
 [My process](#my-process)

        
 [Built with](#built-with)

    
 [Author](#author)

    
 [Acknowledgments](#acknowledgments)



Overview


Screenshot


![Desktop-Preview](images/Desktop-Preview.png)

![Mobile-Preview](images/Mobile-Preview.png)

Links


- Live Site URL: [Live Site](https://qr-code-component-by-yashi.netlify.app/)

My Process


Built With


- Semantic HTML5 Markup

- CSS custom properties

- Flexbox

- Mobile-first workflow


Author


Frontend Mentor - [@Yashi-Singh-1](https://www.frontendmentor.io/profile/Yashi-Singh-1)

LinkedIn - [Yashi Singh](www.linkedin.com/in/yashi-singh-b4143a246)

Acknowledgments


I would like to extend my heartfelt thanks to the following individuals and resources for their invaluable support and inspiration:




 Frontend Mentor: For providing the challenge and helping me improve my front-end skills with practical projects.



My Peers and Mentors: For their constructive feedback and encouragement throughout the development process.