Style Guide

Colors Style

Background Color

background-color-primary

background-color-secondary

background-color-alternate

Text Color

text-color-primary

Grey/900

text-color-secondary

smalt blue

text-color-alternate

White

Typography

Typeface 1

Inter

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz

0123456789 !@#$%^&*()

Heading Tag

H1 tag

Heading 1

H2 tag

Heading 2

H3 tag

Heading 3

H4 tag

Heading 4

H5 tag

Heading 5

H6 tag

Heading 6

Heading Style class

heading-style-h1

Heading 1

heading-style-h2

Heading 2

heading-style-h3

Heading 3

heading-style-h4

Heading 4

heading-style-h5

Heading 5

heading-style-h6

Heading 6

Body Text

Font size:18px
Line height: 150%
Letter Spacing: 0%

body-1

Font size:16px
Line height: 150%
Letter Spacing: 0%

body-2

Font size:16px
Line height: 150%
Letter Spacing: 0%

body-3

Font size:14px
Line height: 150%
Letter Spacing: 0%

body-4

Button

Button

Button

Button with arrow

Button

Spacing Style

Global Spacing

container
padding-bottom
padding-top
margin-top
margin-bottom
padding-global
padding-section-large-120

Padding style

padding-vertical
padding-horizontal
padding-tiny-8
padding-xxsmall-12
padding-xsmall-16
padding-small-24
padding-medium-32
padding-large-40
padding-xlarge-48
padding-xxlarge-56
padding-huge-64
padding-xhuge-72
padding-xxhuge-80
padding-custom1
padding-custom2

Margin Style

margin-vertical
margin-horizontal
margin-tiny-8
margin-xxsmall-12
margin-xsmall-16
margin-small-24
margin-medium-32
margin-large-40
margin-xlarge-48
margin-xxlarge-56
margin-huge-64
margin-xhuge-72
margin-xxhuge-80
margin-custom1
margin-custom2
Copied!