Colors
Deep Sea Blue
Hex: #054950
This is used as a font color for lighter backgrounds.
Sea Blue
Hex: #789A9F
This is used as the secondary background color.
Jet Orange
Hex: #F78F1E
This is used as a font/background color for links and other interactive components.
Pale Sea Blue
Hex: #EDF4F5
This is the primary background color.
white
Hex: #FFFFFF
This is used as a font color on darker backgrounds and as some background colors too.
Fonts
Caveat
When to use
Caveat is used for h1-h3 elements
Styling
This font family is used in bold only or 700 if you want the number.
Sample text
"The quick brown fox jumps over the lazy dog"
M PLUS Rounded 1c
When to use
M PLUS Rounded 1c is used for the bulk of the page i.e, p elements and links. it is also used for some headings to but with a lower priorty over Caveat.
Styling
This font family is used in regular 400 and bold 700. This font family does not have an italic style but if needed most browsers will put the text on a slant if the em tag is used.
Sample text
"The quick brown fox jumps over the lazy dog"
Text Styles
Main heading
- Font-family: Caveat
- Font-size: 42px
- Font-weight: Bold 700
- Font style: Cursive
Sub headings
- Font-family: Caveat or M PLUS Rounded (for less impotant sub headings)
- Font-size: 32px, 22px or 18px(for M Plus)
- Font-weight: Bold 700
- Font style: Cursive or Sans-serif
p & a elements
- Font-family: M PLUS Rounded 1c
- Font-size: 16px
- Font-weight: Regular 400 or Bold 700(for links)
- Font style: Sans-serif