Style Guide

The fonts used are Roboto Slab and Inter. These are free Google fonts.

Typography

TYPOGRAPHY
Headings

The quick brown fox...

The quick brown fox...

The quick brown fox...

The quick brown fox...

The quick brown fox...

The quick brown fox...

The quick brown fox...

The quick brown fox...

The quick brown fox...

The quick brown fox...
The quick brown fox...
The quick brown fox...
The quick brown fox...
TYPOGRAPHY
Paragraph

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

TYPOGRAPHY
Label
Lorem ipsum dolor sit
Lorem ipsum dolor sit
TYPOGRAPHY
Overline
Lorem ipsum dolor sit
Lorem ipsum dolor sit
TYPOGRAPHY
Text Weights

The quick brown fox...

The quick brown fox...

The quick brown fox...

The quick brown fox...

The quick brown fox...

TYPOGRAPHY
Text Alignments

The quick brown fox...

The quick brown fox...

The quick brown fox...

TYPOGRAPHY
Text Styles

The quick brown fox...

The quick brown fox...

The quick brown fox...

The quick brown fox...

TYPOGRAPHY
General HTML Tags

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.

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.
  • The quick brown fox jumps over the lazy dog
  • The quick brown fox jumps over the lazy dog
  • The quick brown fox jumps over the lazy dog
UTILITY
Rich Text

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing 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 consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript

Colors

Utility

ELEMENTS
Form
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Layouts

UTILITY
Title Wrappers
Title Wrapper Example

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.

Title Wrapper Example

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.