Typography
Type scale and text styles
Heading Scale
Heading 1
.h1 text-3xl → text-4xl, font-medium Heading 2
.h2 text-2xl → text-3xl, font-medium Heading 3
.h3 text-xl, font-medium Heading 4
.h4 text-lg, font-medium Heading 5
.h5 text-base, font-semibold Heading 6
.h6 text-sm, uppercase, tracking-wider MDX Content Headings
Headings within MDX content (work and notes) use a different scale optimized for reading:
Heading 1
H1 (screen reader only)
.markdown-content h1 sr-only — Page title handles visual H1 Heading 2
.markdown-content h2 text-size-xl (text-lg → text-xl), font-semibold Heading 3
.markdown-content h3 text-size-lg (text-base → text-lg), font-medium Eyebrow Labels
Section Label
.eyebrow Small, uppercase text with accent color. Used for section labels and categorization.
Text Size Tokens
Extra large — text-lg to text-xl
.text-size-xl Large — text-base to text-lg
.text-size-lg Base — text-sm to text-base
.text-size-base Small — text-xs to text-sm
.text-size-sm Extra small — text-xs (static)
.text-size-xs Link Styles
.link-subtle Muted link style with hover transition. Used for navigation and secondary actions.
Font Families
Inter Variable
font-sans, font-heading, font-body Georgia Serif
font-serif System Monospace
font-mono