Skip to main content


PIE typography works with our layouts to present content in a clear hierarchy and in a way that's easy to read.

Global typography tokens

These are the original values in our design language, represented by context-agnostic names. They define the values that can be assigned to our alias tokens, which are the ones used in Graphical User Interfaces (GUI) while designing and developing our products.

Font family

$font-family-primary JET Sans
$font-family-secondary Arial
$font-family-code PT Mono

Font weight

$font-weight-extrabold Extra bold
$font-weight-bold Bold
$font-weight-regular Regular

Font size

$font-size-12 Text size: 12px, Line height: 16px
$font-size-14 Text size: 14px, Line height: 20px
$font-size-16 Text size: 16px, Line height: 24px
$font-size-20 Text size: 20px, Line height: 28px
$font-size-24 Text size: 24px, Line height: 32px
$font-size-28 Text size: 28px, Line height: 36px
$font-size-32 Text size: 32px, Line height: 40px
$font-size-48 Text size: 48px, Line height: 56px

Font style

$font-style-underline Text decoration: underline

Paragraph spacing

$font-paragraph-spacing-01 Paragraph spacing: 16px
$font-paragraph-spacing-02 Paragraph spacing: 14px
$font-paragraph-spacing-03 Paragraph spacing: 12px

Letter spacing

$font-letter-spacing-00 Letter spacing: default