font

CSS design_tokens/font.css
  
    /* set font family */
    font-family: var(--font-sans);
    /* set line-height corresponding to font size */
    line-height: var(--line-height-70);
    /* set offset corresponding to font family and size to align to baseline (remove extra --space on ::after) */
    padding: var(--font-padding-70);
font-family:
  • article body

    --font-serif

    "Financier Text", Athelas, Cambria, Source Serif Pro, serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, serif

    • Financier Text Regular
    • Financier Text Bold
  • article title

    --font-serif-2

    "Financier Display", Athelas, Cambria, Source Serif Pro, serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, serif

    • Financier Display Medium
  • UI, post lead, ...

    --font-sans

    "Ratio", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif

    • Ratio Regular
    • Ratio Bold