Skip to content
Submitted about 1 year ago

Simple QR Code Component using basic HTML & CSS

Aidan van Geest•10
@AidanvG
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 struggled to get the blue background colour the same as in the screenshots provided. Is there a way to get the RGB/Hex values from a specific part of an image, or is that not possible?

I'm not super familiar with semantics for html, so please could you suggest what elements I could have used instead of divs.

I would also like to know, generally speaking, when it is more appropriate to use % values (or other relative values) instead of px values when working with sizing, margin, padding, etc.

I would also appreciate any other general feedback :)

Community feedback

  • Atif Iqbal•3,200
    @atif-devPosted about 1 year ago

    Hi, congrats🎉 on completing the challenge.

    • You can pick a color from an image using any color picker. Download one from here.
    • Read from here to know about semantic elements: link1, Link2, Link3, Link4
    • For different units working I think you should learn responsiveness, you can learn responsiveness from a free source from here
    • When we open GitHub repository link, at right side you will find an About Section. There, also include live preview link of your project. It is better for someone to check your live project while interacting with code.

    Hope you will find this Feedback Helpful.

    Let's connect for learning📝 and sharing🤝. Twitter , LinkedIn

    Marked as helpful
    1
  • Aravindhan•320
    @aravindhan7Posted about 1 year ago
    1. Use any color picker app or extension, so that you can know the exact color from anything on your screen.

    2.Kindly go thorugh the source regarding semantic tags

    3.And regarding (px,em,rems) Use px for small, fixed-size elements like borders or shadows. Use em for typography and other scalable elements that need to change size relative to their parent element. Use rem for scalable typography and responsive layouts that need to change size relative to the root element.

    And BTW your solution is super good!

    Marked as helpful
    1
    Aidan van Geest•10
    @AidanvGPosted about 1 year ago

    Thanks for the feedback!

    0

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