Typography
Rich Text
Colors
Buttons
Forms

Style Guide

On this Page you can find all the Elements that have been used across the Website. This allows you to make global changes to all forms of Typography, Colors, Forms & more.

Typography

Headings

Heading
XXL

Heading

Heading
XL

Heading

Heading
L

Heading

Heading
M

Heading

Heading
S

Heading

Heading
XS

Heading

Heading
XXS

Heading

Paragraphs

Paragraph
Small

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Paragraph
Large

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Lists

Unordered List
  • This is a List Item
  • This is a List Item
  • This is a List Item
Ordered List
  1. This is a List Item
  2. This is a List Item
  3. This is a List Item

Links

Link
Text Link

Rich Text

Heading
H1

Heading

Heading
H2

Heading

Heading
H3

Heading

Heading
H4

Heading

Heading
H5
Heading
Heading
H6
Heading
Paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Quote
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Image
This is an image Caption

Colors

Neutral Colors
Neutral 50
Neutral 100
Neutral 200
Neutral 300
Neutral 400
Neutral 500
Neutral 600
Neutral 700
Neutral 800
Neutral 900
Neutral 950
Primary Colors
Primary 1
System Colors
Success 400
Success 500
Success 600
Warning 400
Warning 500
Warning 600
Error 500
Error 600
Error 700

Buttons

Primary
Large
Button Text
Primary
Button Text
Primary
Small
Button Text
Secondary
Large
Button Text
Secondary
Button Text
Secondary
Small
Button Text

Form Elements

Input Fields
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Input Fields with Button
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Message Fields
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Select
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Checkbox / Radio Buttons
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.