Find the Perfect Typography Pairing for Your Design Project
Get expert typography pairing recommendations with type scales, spacing guidelines, and CSS fallback stacks for any design project.
📝 The Prompt
Act as a senior typographer and visual design expert. Recommend detailed typography pairings for a [TYPE OF PROJECT, e.g., SaaS landing page, editorial magazine, e-commerce store] targeting [TARGET AUDIENCE]. The overall design aesthetic is [DESIGN STYLE, e.g., modern minimalist, vintage editorial, corporate professional], and the content will primarily be read on [PLATFORM, e.g., web, mobile app, print].
Please provide the following:
1. **Primary Pairing Recommendation**: Suggest a heading font and a body font that work harmoniously together. For each font, specify:
- Font name and foundry/source (Google Fonts, Adobe Fonts, or premium)
- Font classification (e.g., geometric sans-serif, transitional serif, humanist sans)
- Recommended weights to use (e.g., Regular 400, Semi-Bold 600, Bold 700)
- Why this font suits the project's tone and audience
2. **Typographic Scale**: Define a modular type scale for the pairing using a specific ratio (e.g., 1.250 Major Third). List pixel sizes for: H1, H2, H3, H4, body text, small/caption text, and button text.
3. **Line Height & Spacing**: Recommend optimal line-height values for headings and body text, plus letter-spacing adjustments for uppercase text, headings, and body copy.
4. **Hierarchy & Contrast**: Explain how the pairing creates visual hierarchy. Describe the contrast principle at work (e.g., serif vs. sans-serif, geometric vs. humanist, weight contrast).
5. **Alternative Pairings**: Provide 2 additional pairing options — one free alternative (Google Fonts only) and one premium alternative — with brief rationale for each.
6. **Fallback Stack**: For each recommended font, provide a complete CSS font-family fallback stack for web implementation.
7. **Accessibility Notes**: Address readability considerations including minimum body text size, line length recommendations (characters per line), and any concerns for dyslexic or low-vision readers.
Format your response with clear sections and include sample text snippets demonstrating each pairing if possible.
💡 Tips for Better Results
Specify whether you need free fonts (Google Fonts) or are open to premium options — this dramatically changes the recommendations.
Mention the content type (long-form articles, short marketing copy, data-heavy dashboards) since different content demands different typographic approaches.
If you already have one font locked in, share it and ask for pairing suggestions specifically for that typeface.
🎯 Use Cases
Perfect for web designers, UI/UX designers, and brand teams who need professionally paired typefaces with practical implementation details for digital or print projects.