Skip to content
Submitted almost 2 years ago

Simple QR Component using HTML/CSS

Vlad•240
@vladmee
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...QR code component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

  • I rarely use the HSL color model but, for this solution, I found it easy to use these values as given.
  • I'm mostly writing scss and for this solution would have been overengineering to include Sass so going back to writing CSS and chaining classes and tags was fun.
  • I had to google how to make an <img> tag fluid within a parent container (setting its width to 100% and height to auto).
  • I was debating between a simple margin: 0 auto or text-align: center to horizontally center the card on mobile (I chose the latter).

Community feedback

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord