Desktop-first QR code component

Good work, very organized html! :)

I noticed your qr-code is on the upper left. A tip I give is that to center the container on the screen, one option is using flexbox on the body and defining a height (100vh is good for desktop, but doesn't work well for mobile) and a witdh (100%).

body {
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

Links if you want to see more: Flexbox, Css Units(vh, vw...)

Use this code in the body tag :-

Padding :10px; Margin : 110px auto: Width: 100%; Max-Width: 1440px;