QR code component

Well at least for me it's all in the guessing, over time you get a bit better at guessing at the sizes of everything but I doubt you'll ever be pixel perfect without the actual sizes and dimensions and I don't mean this in a bad and mean way I mean this in a good way, you shouldn't even go for the solution to be the exact same size as the one provided your main focus should be good code and usage of best practices. So my suggestion for you would be not to worry to get everything the right size since it's rather a hard task without the proper files but to go for readable, good and best code you can produce and if your header's font size is off by a few pixels it's not that bad :)

If you get the pro or get a job as a frontend developer then you'll get all the files you'll need with all the dimension and you wont have to keep guessing but as I said for a beginner and even for some of more experienced developers you shouldn't worry about everything being pixel perfect but that you get the design right, responsiveness, functionality (if there is some) and all the other stuff and then you can play around with dimensions and sizes to try to get it to that point where it's perfect with the design provided but it's not a priority.

Anyways great job on this one, hope you keep it up :D

Hey Shashree. Thanks so much for your observation, I think you're right!

Hey good job completing this challenge

Keep up the good work

Your solution looks great however I think that the card is missing a subtle box shadow using box-shadow.

I hope this helps

Cheers Happy coding 👍

Hi!

These are the tools you can use to create a pixel perfect website:

• Pixel Perfect Pro - This helps me to display a screenshot on top of the webpage to easily check if dimensions were accurate. This is super useful is you need to create pixel perfect work.
• PX: Viewport Dimensions - This add-on will show you the dimensions of your viewport while resizing your browser.

Other tools:

• Figma - This helped me create a rapid mockup to get dimensions of components.

In case you have a screen smaller than the designs provided (usually they have 1440px in width), you can open the developer tools in Chrome or Firefox and display the page with the exact dimensions you need (desktop or mobile).