Type

coming soon..

Use utility & layout classes for the stuff you keep repeating.

Coming soon

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. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Font

Weight
Aa

System-UI

Font Black

Aa

System-UI

Font Extrabold

Aa

System-UI

Font Bold

Aa

System-UI

Font Semibold

Aa

System-UI

Font Medium

Aa

System-UI

Font Normal

Aa

System-UI

Font Light

Aa

System-UI

Font Thin

Aa

System-UI

Font Hairline

Font usage
Aa

Proxima Nova

Font Heading

Aa

Lato

Font Body

Categories
Aa

Merriweather

Font Serif

Aa

Open Sans

Font Sans

Aa

Inconsolata

Font Mono

Style
Aa

Italic

Text Italic

Aa

Not Italic

Text Not Italic

Aa

Underlined

Text Underline

Aa

No Line

Text No Line

Aa

Line Through

Text Linethrough

Transform
Aa

Upper Case

Text Uppercase

Aa

Lower Case

Text Lowercase

Aa

Capitalize

Text Capitalize

Aa

Normal Case

Text Normal Case

Letter spacing / Tracking
Aa

Tighter

Tracking Tighter

Aa

Tight

Tracking Tight

Aa

Normal

Tracking Normal

Aa

Wide

Tracking Wide

Aa

Wider

Tracking Wider

Aa

Widest

Tracking Widest

Line Height / Leading
Aa

None

Leading None

Aa

Tight

Leading Tight

Aa

Snug

Leading Snug

Aa

Normal

Leading Normal

Aa

Relaxed

Leading Relaxed

Aa

Loose

Leading Loose

Alignment
Aa

Aligned Left

Text Left

Aa

Aligned Right

Text Right

Aa

Centered

Text Center

Aa

Justified

Text Justify

Headings

H1

Heading One

XL: 48px
LG: 40px
MD: 32px
SM: 32px

H2

Heading Two

XL: 36px
LG: 32px
MD: 26px
SM: 26px

H3

Heading Three

XL: 28px
LG: 24px
MD: 22px
SM: 22px

H4

Heading Four

XL: 18px
LG: 18px
MD: 18px
SM: 18px

H5

Heading Five

XL: 48px
LG: 40px
MD: 32px
SM: 32px

H6

Heading Six

XL: 48px
LG: 40px
MD: 32px
SM: 32px

Sizes
Aa

12px

Text 12

Aa

14px

Text 14

Aa

16px

Text 16

Aa

18px

Text 18

Aa

20px

Text 20

Aa

24px

Text 24

Aa

30px

Text 30

Aa

36px

Text 36

Aa

48px

Text 48

Aa

60px

Text 60

Aa

72px

Text 72