Comfort and confidence, now in pad form. Shop our ultra-thin, ultra-absorbent, ultra-breathable pads

UI Components

On Coral

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Shell

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Poppy

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Terracotta

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Canyon

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Tourmaline

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Seafoam

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Agave

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Lilac

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Cerulean

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Jade

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Neutral 5

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Neutral 4

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Neutral 3

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Neutral 2

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

UI Components

On Neutral 1

Typography

  • H1

    The quick brown fox jumps over the lazy dog

  • H2

    The quick brown fox jumps over the lazy dog

  • H3

    The quick brown fox jumps over the lazy dog

  • H4

    The quick brown fox jumps over the lazy dog

  • H5

    The quick brown fox jumps over the lazy dog
  • P

    The quick brown fox jumps over the lazy dog

  • H6

    The quick brown fox jumps over the lazy dog
  • H7

    The quick brown fox jumps over the lazy dog
Element Desktop Tablet Mobile
H1 Size: 60px / Line Height: 1.16em / Letter Spacing: -.88px Size: 50px / Line Height: 1.16em / Letter Spacing: -.5px Size: 40px / Line Height: 1.16em / Letter Spacing: -.5px
H2 Size: 48px / Line Height: 1.16em Size: 40px / Line Height: 1.16em Size: 32px / Line Height: 1.16em
H3 Size: 38px / Line Height: 1.16em Size: 32px / Line Height: 1.16em Size: 24px / Line Height: 1.16em
H4 Size: 30px / Line Height: 1.16em Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em
H5 Size: 24px / Line Height: 1.16em Size: 20px / Line Height: 1.16em Size: 18px / Line Height: 1.16em
P Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em Size: 18px / Line Height: 1.3em
H6 Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em Size: 14px / Line Height: 1.4em
H7 Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px Size: 11px / Line Height: 1.45em / Letter Spacing: .22px

Buttons

CTA

Textfield

Logotype

Colors

Neutral 1 #fefaf8
Neutral 2 #f9f1e9
Neutral 3 #ccbeb6
Neutral 4 #59534f
Neutral 5 #3e3938
Coral #ffb190
Poppy #ff5221
Terracotta #b25d54
Canyon #be827e
Shell #f8d3c7
Tourmaline #007e75
Seafoam #9cffeb
Agave #f0ff7a
Lilac #fdadff