Website Styleguide
A high-level representation to the website look and feel. In addition, you can also navigate to the component library page to view all premade blocks and sections!
Headings
BESLEY is our primary font family. It should be used for headings and large text. In general, use the Semibold 600 font weight of Besley.
NOTE: Both font families are google fonts, and can be downloaded by following the links above.
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
"eyebrow" text
Paragraph Styles
ALBERT SANS is our secondary font family, used as the backbone of our typographic style, providing a modern and clean feel with ultra readability. The main font weights used are Regular 400 and Bold 700. In certain cases it may warrant using other weights – eg. using Light for larger text, or Medium to improve readability body copy on top of certain backgrounds.
Lead Text — Lorem ipsum dolor sit amet eiusmod tempor ut labore et dolore magna veniam, quis ut commodo dolor anim is integre.
Standard Paragraph Text — Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sample text link… ut aliquip ea commodo. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur sint non sunt in culpa.
Small Text Styling — Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.
“Blockquote — Through our wealth of programming and partnerships, we unite the region’s innovative…
Color Palette
#FC6D3D Primary
#F5562A
#FFF4E0
#F2E6CE
#E6D7BC
#20403D
#245955
#0D4259
#175773
#A4EBE8
#E0FFF7