Style Guide

Styles, typography, color, images... all the available styles to customize the site. All the changes you make here will be applied throughout the entire website.
Typography
Global Classes
Text 9xl
Font size: 8rem
Line height: 100%
Letter spacing: -0.03em
Weights: Regular, Medium, Bold
Text 8xl
Font size: 6rem
Line height: 100%
Letter spacing: -0.02em
Weights: Regular, Medium, Bold
Text 7xl
Font size: 4.5rem
Line height: 100%
Letter spacing: -0.02em
Weights: Regular, Medium, Bold
Text 6xl
Font size: 3.75rem
Line height: 100%
Letter spacing: -0.02em
Weights: Regular, Medium, Bold
Text 5xl
Font size: 3rem
Line height: 110%
Letter spacing: -0.04em
Weights: Regular, Medium, Bold
Text 4xl
Font size: 2.25rem
Line height: 110%
Letter spacing: 0px
Weights: Regular, Medium, Bold
Text 3xl
Font size: 1.875rem
Line height: 120%
Letter spacing: 0px
Weights: Regular, Medium, Bold
Text 2xl
Font size: 1.5rem
Line height: 140%
Letter spacing: 0px
Weights: Regular, Medium, Bold
Texl xl
Font size: 1.25rem
Line height: 140%
Letter spacing: 0px
Weights: Regular, Medium, Bold
Text Large
Font size: 1.125rem
Line height: 160%
Letter spacing: 0px
Weights: Regular, Medium, Bold
Text Base
Font size: 1rem
Line height: 150%
Letter spacing: -0.01875em
Weights: Regular, Medium, Bold
Text Small
Font size: 0.875rem
Line height: 140%
Letter spacing: 0px
Weights: Regular, Medium, Bold
Text XS
Font size: 0.75rem
Line height: 130%
Letter spacing: 0px
Weights: Regular, Medium, Bold
Text alignment
Text align left
Text align center
Text align right
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

Buttons
Variants
Button Text
Style: Primary
States: Default, Hover, Focused
Button Text
Style: Secondary
States: Default, Hover, Focused
Button Text
Style: Secondary
States: Default, Hover, Focused
Button Text
Style: Brand
States: Default, Hover, Focused
Colors
Neutral Grey
50
100
200
300
400
500
600
700
800
900
950
Cream
50
100
200
300
400
500
600
700
800
900
950
States
Error
Success
Warning