Skip to content

Latest commit

 

History

History
49 lines (29 loc) · 944 Bytes

File metadata and controls

49 lines (29 loc) · 944 Bytes

Front-end Style Guide

Layout

The designs were created to the following widths:

  • Mobile: 375px
  • Desktop: 1440px

Colors

Primary

  • Light red: hsl(0, 100%, 67%)
  • Orangey yellow: hsl(39, 100%, 56%)
  • Green teal: hsl(166, 100%, 37%)
  • Cobalt blue: hsl(234, 85%, 45%)

Gradients

  • 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)

Neutral

  • White: hsl(0, 0%, 100%)
  • Pale blue: hsl(221, 100%, 96%)
  • Light lavender: hsl(241, 100%, 89%)
  • Dark gray blue: hsl(224, 30%, 27%)

Notes

Use transparency to get the colour variations necessary to match the design. Hint: look into using hsla().

Typography

Body Copy

  • Font size (paragraphs): 18px

Font