Sample Page – Style Guide
Global Font Styling
Use when you need to override the H tags and set element styling (typography and color) manually.
Header Elements
Headline - H1
Roboto Condensed 3rem; UPPERCASE
#7D2173
Sub Header - H2
Roboto Condensed Semi Bold (600) , 2.5rem: Capitalize, #7D2173
Small Title 1 - H3
Roboto Condensed 1.7rem
Small Title 2 - H4
Roboto Bold (700) 1.7rem
Accent - H5
EB Garamond Semi Bold (600)1.4rem
Small Title 3 - H6
Roboto 1.4rem
Paragraph
Roboto 1rem
Text Editor Elements
Headline – H1
Sub Header – H2
Small Title 1 – H3
Small Title 2 – H4
Accent – H5
Small Title 3 – H6
Paragraph
Global Colors
Global Colors and Button Styling
Primary
#7D2173
- Menu tabs (off state)
- Primary CTAs
- Important infoboxes
- Headlines
- Buttons
Secondary
dc5988
- Primary CTAs
- Accents
- Text links
Secondary Hover
9E2064
Body
030001
Button / Accent
a5cc39
Button / Accent Hover
1e8240
Accent
6CC8C1
Accent
069ec9
Accent
4b1b3a
Primary Background
ECECEC
Primary Buttons
Secondary Buttons
Icon
Icon Box
This is the heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Icon List
- List Item #1
- List Item #2
- List Item #3
Counter
Accent Color Button