Style Guide

Font Reference

Sofia Pro

Headings

Sofia Pro

Paragraphs

Sofia Pro

Buttons

Sofia Pro

Miscellaneous

Color Reference

#F7F7F7

#FFFFFF

#38383B

#A8A6A1

#38383B

Lightest 1

HEADINGS 1 TO 4

This is my heading 1.

This is my heading 2.

This is my heading 3.

This is my heading 4.

PARAGRAPHS 1 to 3

This is my big paragraph font style.

This is my big paragraph font style.

This is my big paragraph font style.

This is my monospace font style.

BUTTONS

Primary Button
Secondary Button
Tertiary Button

QUOTES

“Whatever it is, the way you tell your story online can make all the difference.”
— Quote Source

LINKS

LINES

Lightest 2

This is my heading 1.

This is my heading 2.

This is my heading 3.

This is my heading 4.

This is my big paragraph font style.

This is my big paragraph font style.

This is my big paragraph font style.

This is my monospace font style.
Primary Button
Secondary Button
Tertiary Button
“Whatever it is, the way you tell your story online can make all the difference.”
— Quote Source

Light 1

This is my heading 1.

This is my heading 2.

This is my heading 3.

This is my heading 4.

This is my big paragraph font style.

This is my big paragraph font style.

This is my big paragraph font style.

This is my monospace font style.
Primary Button
Secondary Button
Tertiary Button
“Whatever it is, the way you tell your story online can make all the difference.”
— Quote Source

Light 2

This is my heading 1.

This is my heading 2.

This is my heading 3.

This is my heading 4.

This is my big paragraph font style.

This is my big paragraph font style.

This is my big paragraph font style.

This is my monospace font style.
Primary Button
Secondary Button
Tertiary Button
“Whatever it is, the way you tell your story online can make all the difference.”
— Quote Source

Bright 1

This is my heading 1.

This is my heading 2.

This is my heading 3.

This is my heading 4.

This is my big paragraph font style.

This is my big paragraph font style.

This is my big paragraph font style.

This is my monospace font style.
Primary Button
Secondary Button
Tertiary Button
“Whatever it is, the way you tell your story online can make all the difference.”
— Quote Source

Bright 2

This is my heading 1.

This is my heading 2.

This is my heading 3.

This is my heading 4.

This is my big paragraph font style.

This is my big paragraph font style.

This is my big paragraph font style.

This is my monospace font style.
Primary Button
Secondary Button
Tertiary Button
“Whatever it is, the way you tell your story online can make all the difference.”
— Quote Source

Dark 1

This is my heading 1.

This is my heading 2.

This is my heading 3.

This is my heading 4.

This is my big paragraph font style.

This is my big paragraph font style.

This is my big paragraph font style.

This is my monospace font style.
Primary Button
Secondary Button
Tertiary Button
“Whatever it is, the way you tell your story online can make all the difference.”
— Quote Source

Dark 2

This is my heading 1.

This is my heading 2.

This is my heading 3.

This is my heading 4.

This is my big paragraph font style.

This is my big paragraph font style.

This is my big paragraph font style.

This is my monospace font style.
Primary Button
Secondary Button
Tertiary Button
“Whatever it is, the way you tell your story online can make all the difference.”
— Quote Source

Darkest 1

This is my heading 1.

This is my heading 2.

This is my heading 3.

This is my heading 4.

This is my big paragraph font style.

This is my big paragraph font style.

This is my big paragraph font style.

This is my monospace font style.
Primary Button
Secondary Button
Tertiary Button
“Whatever it is, the way you tell your story online can make all the difference.”
— Quote Source

Darkest 2

This is my heading 1.

This is my heading 2.

This is my heading 3.

This is my heading 4.

This is my big paragraph font style.

This is my big paragraph font style.

This is my big paragraph font style.

This is my monospace font style.
Primary Button
Secondary Button
Tertiary Button
“Whatever it is, the way you tell your story online can make all the difference.”
— Quote Source