Type direction — Type Explorer

Agents: this site has a machine-readable contract. The home page (googlefontfinder.com) carries a self-contained quickstart for composing a shareable type direction in one fetch; the full contract is at /agent.md, indexed at /llms.txt.

Letters That Carry the Weight

A display voice that performs, set against a text voice that endures.

A typeface reveals itself at length. In a paragraph you feel its rhythm, the way its counters hold light, how it paces a line. One specimen at reading size tells you more than a dozen names ever could.

Epilogue & Baskervville

Letters That Carry the Weight

A display voice that performs, set against a text voice that endures.

Epunda Slab & Epunda Sans

Letters That Carry the Weight

A display voice that performs, set against a text voice that endures.

Work Sans & Bitter

Colors

40534C

title

F0E4D3

subtitle

f4b937

paragraph

AEBAB0

accent

F1A805

page

1d2522

Render notes

pairs: nothing resolvable — showing the site's default direction instead

canonical: /compose?

Implementation

HTML

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Epilogue:ital,wght@0,100..900;1,100..900&family=Baskervville:ital,wght@0,400..700;1,400..700&family=Epunda+Slab:ital,wght@0,300..900;1,300..900&family=Epunda+Sans:ital,wght@0,300..900;1,300..900&family=Work+Sans:ital,wght@0,100..900;1,100..900&family=Bitter:ital,wght@0,100..900;1,100..900&display=swap">

CSS @import

@import url("https://fonts.googleapis.com/css2?family=Epilogue:ital,wght@0,100..900;1,100..900&family=Baskervville:ital,wght@0,400..700;1,400..700&family=Epunda+Slab:ital,wght@0,300..900;1,300..900&family=Epunda+Sans:ital,wght@0,300..900;1,300..900&family=Work+Sans:ital,wght@0,100..900;1,100..900&family=Bitter:ital,wght@0,100..900;1,100..900&display=swap");

Tailwind v4 theme

@theme {
  --font-epilogue: "Epilogue", system-ui, -apple-system, sans-serif;
  --font-baskervville: "Baskervville", Georgia, 'Times New Roman', serif;
  --font-epunda-slab: "Epunda Slab", Georgia, 'Times New Roman', serif;
  --font-epunda-sans: "Epunda Sans", system-ui, -apple-system, sans-serif;
  --font-work-sans: "Work Sans", system-ui, -apple-system, sans-serif;
  --font-bitter: "Bitter", Georgia, 'Times New Roman', serif;
  --color-card-bg: #40534C;
  --color-card-fg: #F0E4D3;
  --color-card-muted: #AEBAB0;
  --color-card-accent: #F1A805;
  --color-card-title: #F0E4D3;
  --color-card-subtitle: #f4b937;
  --color-card-paragraph: #AEBAB0;
  --color-card-rule: #726b38;
  --color-card-label: #F1A805;
}

CSS custom properties

:root {
  --font-epilogue: "Epilogue", system-ui, -apple-system, sans-serif;
  --font-baskervville: "Baskervville", Georgia, 'Times New Roman', serif;
  --font-epunda-slab: "Epunda Slab", Georgia, 'Times New Roman', serif;
  --font-epunda-sans: "Epunda Sans", system-ui, -apple-system, sans-serif;
  --font-work-sans: "Work Sans", system-ui, -apple-system, sans-serif;
  --font-bitter: "Bitter", Georgia, 'Times New Roman', serif;
  --card-bg: #40534C;
  --card-fg: #F0E4D3;
  --card-muted: #AEBAB0;
  --card-accent: #F1A805;
  --card-title: #F0E4D3;
  --card-subtitle: #f4b937;
  --card-paragraph: #AEBAB0;
  --card-rule: #726b38;
  --card-label: #F1A805;
}

Faces

Epilogue (sans-serif)
  stack:   "Epilogue", system-ui, -apple-system, sans-serif
  axes:    wght 100..900
  italic:  yes

Baskervville (serif)
  stack:   "Baskervville", Georgia, 'Times New Roman', serif
  axes:    wght 400..700
  italic:  yes

Epunda Slab (serif)
  stack:   "Epunda Slab", Georgia, 'Times New Roman', serif
  axes:    wght 300..900
  italic:  yes

Epunda Sans (sans-serif)
  stack:   "Epunda Sans", system-ui, -apple-system, sans-serif
  axes:    wght 300..900
  italic:  yes

Work Sans (sans-serif)
  stack:   "Work Sans", system-ui, -apple-system, sans-serif
  axes:    wght 100..900
  italic:  yes

Bitter (serif)
  stack:   "Bitter", Georgia, 'Times New Roman', serif
  axes:    wght 100..900
  italic:  yes