Typography

question?

This is the answer

  • some
  • bullet
  • points

maybe a link?

Headings

Heading XL

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6
TAGLINE
TAGLINE
TAG

Text / Body Copy

Text XL Normal
Text XL Bold
Text Large Normal
Text Large Bold
Text Medium Normal
Text Medium Bold
Text Base Normal
Text Base Bold
Text Small Normal
Text Small Bold
Text XSmall Normal
Text XSmall Bold
ALL CAPS TEXT
This is some text inside of a div block.
serif-font
sans-serif font
mono-font
financier-font
Components
Base ButtonReverse ButtonNaked ButtonOutline ButtonOutline WhiteOutline BlackOutline Glass
button
button
Display flex
h-flex-left-top
h-flex-left-center
h-flex-left-stretch
h-flex-left-bottom
h-flex-center-top
h-flex-center-center
h-flex-center-bottom
h-flex-center-stretch
h-flex-right-top
h-flex-right-center
h-flex-right-bottom
h-flex-right-stretch
h-flex-between-top
h-flex-between-center
h-flex-between-bottom
h-flex-between-stretch
v-flex-left-top
v-flex-left-center
v-flex-left-bottom
v-flex-left-between
v-flex-center-top
v-flex-center-center
v-flex-center-bottom
v-flex-center-between
v-flex-right-top
v-flex-right-center
v-flex-right-bottom
v-flex-right-between
v-flex-stretch-top
v-flex-stretch-center
v-flex-stretch-bottom
v-flex-stretch-between
flex-none
order-first
style_description-text
flex-grow
Small Display flex
sm-h-flex-left-top
sm-h-flex-left-center
sm-h-flex-left-stretch
sm-h-flex-left-bottom
sm-h-flex-center-top
sm-h-flex-center-center
sm-h-flex-center-bottom
sm-h-flex-center-stretch
sm-h-flex-right-top
sm-h-flex-right-center
sm-h-flex-right-bottom
sm-h-flex-right-stretch
sm-h-flex-between-top
sm-h-flex-between-center
sm-h-flex-between-bottom
sm-h-flex-between-stretch
sm-v-flex-left-top
sm-v-flex-left-center
sm-v-flex-left-bottom
sm-v-flex-left-between
sm-v-flex-center-top
sm-v-flex-center-center
sm-v-flex-center-bottom
sm-v-flex-center-between
sm-v-flex-right-top
sm-v-flex-right-center
sm-v-flex-right-bottom
sm-v-flex-right-between
sm-v-flex-stretch-top
sm-v-flex-stretch-center
sm-v-flex-stretch-bottom
sm-v-flex-stretch-between
sm-flex-none
sm-order-first
sm-order-last
sm-flex-grow
Align & Justify
self-align-start
self-align-center
self-align-end
self-align-stretch
justify-self-start
justify-self-center
justify-self-end
self-justify-stretch
Small Align & Justify
sm-self-align-start
sm-self-align-center
sm-self-align-end
sm-self-align-stretch
sm-justify-self-start
sm-justify-self-center
sm-justify-self-end
sm-self-justify-stretch
Utilities
square
clip
hidden
pointer
sm-hide
sm-show
hide
u-grey-text
u-main-text
u-current-text
Grid
grid-1col
grid-2col
grid-3col
grid-4col
grid-5col
grid-6col
grid-8col
grid-12col
sm-grid-1col
sm-grid-2col
col-1
col-2
sm-col-1
sm-col-2