1. Typography
All Font sizes calculated from a base size of 16px/1rem which is the default for most browsers. Font sizes are defined in theme.json The base font is ‘Open Sans’ https://fonts.google.com/specimen/Open+Sans.
H1 – The Quick Brown Fox
XXL – The Quick Brown Fox Jumps Over The Lazy Dog
Fluid
Max Size: 5rem / 80px
Min Size: 2.5rem / 40px
H1 font-family: Brandon Grotesque ; font-weight: 300/Light ; Color: Contrast/#FBAF3F ; text-transform: None
XXL font-family: Open Sans ; font-weight: 300/Light ; Color: Secondary/#333333 ; text-transform: None
H2 – The Quick Brown Fox
XL – The Quick Brown Fox Jumps Over The Lazy Dog
Fluid
Max Size: 4.5rem / 72px
Min Size: 2.2rem / 35px
H2 font-family: Brandon Grotesque ; font-weight: 300/Light ; Color: Secondary/#333333 ; text-transform: None
XL font-family: Open Sans Condensed ; font-weight: 300/Light ; Color: Secondary/#333333 ; text-transform: None
H3 – The Quick Brown Fox
L – The Quick Brown Fox Jumps Over The Lazy Dog
Fluid
Max Size: 3.75rem / 60px
Min Size: 1.8rem / 29px
H3 font-family: Brandon Grotesque ; font-weight: 300/Light ; Color: Secondary/#333333 ; text-transform: None
L font-family: Open Sans Condensed ; font-weight: 300/Light ; Color: Secondary/#333333 ; text-transform: None
H4 – The Quick Brown Fox
M – The Quick Brown Fox Jumps Over The Lazy Dog
Fluid
Max Size: 3rem / 48px
Min Size: 1.5rem / 24px
H4 font-family: Open Sans ; font-weight: 300/Light ; Color: Secondary/#333333
S(small) – Standard Paragraph Text
Not Fluid
Size: 18px / 1.125rem
Font-family: Open Sans ; Color: Secondary/#333333 ; font-weight: 400/Normal
2.Theme Colors
[GOLD] Contrast – #FAAF40
[PURPLE] Primary – #79366A
[BODY TEXT] Secondary – #333333
Lightest Grey – #F2F2F2
Light Grey – #E2E3E4
Dark Grey- #808284
3.Buttons & Links