Front-end Style Guide

Layout

The designs were created to the following widths:

Mobile: 375px
Desktop: 1440px

Size

QR code:
- width: 260px
- height: 260px
- border-radius: 10px
Main:
- width: 290px
- height: 450px
- padding: 15px or 0px
- border-radius: 15px
- box-shadow: 24px
article:
- width: 260px
- height: 160px

Colors

White: hsl(0, 0%, 100%)
Light gray: hsl(212, 45%, 89%)
Grayish blue: hsl(220, 15%, 55%)
Dark blue: hsl(218, 44%, 22%)

Typography

Body Copy

Font size (paragraph): 15px

Font

Family: Outfit
Weights: 400, 700