H1 Headline • 39px (Inter)

Roasted by the water since 2019

H2 Subheading • 31px

A heading set in your pair

Body Copy • 16px (Inter)

Great design systems are not static repositories of color swatches; they are unified design languages bridging creative intent with production frontend engineering. Every modular scale establishes predictable visual hierarchy, enhancing comprehension across both mobile and desktop surfaces.

Monospace Token Specimen • JetBrains Mono

/* Typography System Tokens */
:root {
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  --text-xs: 10px;
  --text-sm: 13px;
  --text-base: 16px;
  --text-h4: 20px;
  --text-h3: 25px;
  --text-h2: 31px;
  --text-h1: 39px;
}