TYPEMATCHSEO

TYPEMATCH.

V2.1

700
400
PAIRING ID: POL-EXO // ETHOS: SERIF + SANS-SERIF

Balancing Poly with Exo 2

Build a contrast-first system where Poly leads and Exo 2 keeps long-form content legible.

Display Face

Poly

Weight: 700

Body Face

Exo 2

Weight: 400

This pairing is engineered for teams that need a clear hierarchy without sacrificing brand voice. Poly brings medium-contrast, agile, web energy to hero units, pricing sections, and campaign headlines. Exo 2 absorbs the heavy lifting for paragraphs, product storytelling, and UI labels with its techno, geometric, futuristic texture and dependable rhythm. Together they create a typography stack that scales from high-impact landing pages to dense documentation without retooling your CSS tokens.

Typographic Hierarchy & Scale

H1The Quick Fox
H2The Quick Fox
H3The Quick Fox
PThe quick brown fox jumps over...
Dark Context
Aa

High contrast negative space.

Accent
Gg

Legibility on high-chroma.

Pairing Strategy

Balancing Poly with Exo 2

Build a contrast-first system where Poly leads and Exo 2 keeps long-form content legible.

This pairing is engineered for teams that need a clear hierarchy without sacrificing brand voice. Poly brings medium-contrast, agile, web energy to hero units, pricing sections, and campaign headlines. Exo 2 absorbs the heavy lifting for paragraphs, product storytelling, and UI labels with its techno, geometric, futuristic texture and dependable rhythm. Together they create a typography stack that scales from high-impact landing pages to dense documentation without retooling your CSS tokens.

Poly thrives as a headline face thanks to its medium-contrast, agile, web qualities. Use weights 400–600 for crisp editorial lockups.
Exo 2 excels in paragraphs and UI thanks to its techno, geometric, futuristic traits. Keep it between weights 400–600 for optimal readability.
Hierarchy guidance: run a 1:1.4 modular scale and reserve Poly for H1–H3 while Exo 2 powers captions, body copy, and data tables.

Best-Fit Use Cases

  • High-growth SaaS landing pages that require medium-contrast hero statements with trustworthy product copy.
  • Editorial magazines and thought-leadership hubs where Poly can dramatize pull quotes while Exo 2 keeps 1,500-word essays skimmable.
  • Conversion funnels or onboarding flows that need Exo 2's techno voice to balance Poly's attention-grabbing display.

Accessibility Notes

Maintain a minimum 4.5:1 contrast ratio for Exo 2 body copy and loosen letter-spacing to 0.01em for uppercase Poly moments. Pairing different categories demands disciplined color pairing—test both light and dark themes to ensure Exo 2 does not bloom at small sizes.

CSS Implementation Cheatsheet

:root {
  --tm-header-family: 'Poly', serif;
  --tm-body-family: 'Exo 2', sans-serif;
  --tm-header-weight: 400;
  --tm-body-weight: 400;
  --tm-header-tracking: -0.01em;
  --tm-body-tracking: 0em;
}
Heading scale: clamp(2.75rem, 4.5vw, 5.25rem) for H1, clamp(1.5rem, 2.8vw, 3rem) for H2, and keep paragraph size at 1rem–1.125rem with 1.6 line-height.
Component guidance: Buttons inherit Poly at 400 for momentum, while forms, tables, and footnotes stay on Exo 2 with 400 weight for predictable kerning.

FAQs

Why does Poly make sense as the lead font?

Poly owns the emotional register of this system. Its medium-contrast, agile, web profile helps anchor campaign creative, meaning marketing and product teams can reuse the same voice without reinventing the scale.

Where should Exo 2 show up?

Exo 2 is the workhorse. Keep it in paragraphs, long-form editorial, knowledge bases, or anywhere legibility is non-negotiable. Its techno, geometric, futuristic qualities reduce fatigue on dense layouts.

Does this pairing support complex localization?

Yes—both families are available on Google Fonts with generous glyph coverage. Test cyrillic/latin accents early, but most Latin-based locales and UI patterns are fully supported.