Style Guide

Typograghy

Default header font styles. Use this as a guide to set responsive font sizes.

Global colors and values

primary

var(--primary) = rgba(0, 44, 120, 1)

var(--primary-rgb) = 0, 44, 120

secondary

var(--secondary) = rgba(75, 82, 93, 1)

var(--secondary-rgb) = 75, 82, 93

accent1

var(--accent1) = rgba(173, 145, 83, 1)

var(--accent1-rgb) = 173, 145, 83

accent2

var(--accent2) = rgba(199, 202, 213, 1)

var(--accent2-rgb) = 199, 202, 213

accent3

var(--accent3) = rgba(112, 112, 112, 1)

var(--accent3-rgb) = 112, 112, 112

accent4

var(--accent4) = rgba(155, 219, 244, 1)

var(--accent4-rgb) = 155, 219, 244

accent5

var(--accent5) = rgba(109, 164, 123, 1)

var(--accent5-rgb) = 109, 164, 123

text

var(--text) = rgba(75, 82, 93, 1)

var(--text-rgb) = 75, 82, 93

subtext

var(--subtext) = rgba(95, 184, 219, 1)

var(--subtext-rgb) = 95, 184, 219

bg-1

var(--bg-1) = rgba(247, 244, 236, 1)

var(--bg-1-rgb) = 247, 244, 236

bg-2

var(--bg-2) = rgba(239, 245, 241, 1)

var(--bg-2-rgb) = 239, 245, 241

Select a Page

Select a Component