The designs were created to the following widths:
- Mobile: 375px
- Desktop: 1440px
- Light red: hsl(0, 100%, 67%)
- Orangey yellow: hsl(39, 100%, 56%)
- Green teal: hsl(166, 100%, 37%)
- Cobalt blue: hsl(234, 85%, 45%)
-
Light slate blue (background): hsl(252, 100%, 67%)
-
Light royal blue (background): hsl(241, 81%, 54%)
-
Violet blue (circle): hsla(256, 72%, 46%, 1)
-
Persian blue (circle): hsla(241, 72%, 46%, 0)
- White: hsl(0, 0%, 100%)
- Pale blue: hsl(221, 100%, 96%)
- Light lavender: hsl(241, 100%, 89%)
- Dark gray blue: hsl(224, 30%, 27%)
Use transparency to get the colour variations necessary to match the design. Hint: look into using hsla()
.
- Font size (paragraphs): 18px
- Family: Hanken Grotesk
- Weights: 500, 700, 800