콘텐츠로 이동

Curated font pairings

Tested heading + body combinations grouped by mood. Pick by best-for and mood keywords, not by aesthetic guess.

# Pairing Type Heading Body Mood Best for
1 Classic Elegant Serif + Sans Playfair Display Inter elegant, luxury, sophisticated, timeless, premium, editorial Luxury brands, fashion, spa, beauty, editorial, magazines, high-end e-commerce
2 Modern Professional Sans + Sans Poppins Open Sans modern, professional, clean, corporate, friendly, approachab SaaS, corporate sites, business apps, startups, professional services
3 Tech Startup Sans + Sans Space Grotesk DM Sans tech, startup, modern, innovative, bold, futuristic Tech companies, startups, SaaS, developer tools, AI products
4 Editorial Classic Serif + Serif Cormorant Garamond Libre Baskerville editorial, classic, literary, traditional, refined, bookish Publishing, blogs, news sites, literary magazines, book covers
5 Minimal Swiss Sans + Sans Inter Inter minimal, clean, swiss, functional, neutral, professional Dashboards, admin panels, documentation, enterprise apps, design systems
6 Playful Creative Display + Sans Fredoka Nunito playful, friendly, fun, creative, warm, approachable Children's apps, educational, gaming, creative tools, entertainment
7 Bold Statement Display + Sans Bebas Neue Source Sans 3 bold, impactful, strong, dramatic, modern, headlines Marketing sites, portfolios, agencies, event pages, sports
8 Wellness Calm Serif + Sans Lora Raleway calm, wellness, health, relaxing, natural, organic Health apps, wellness, spa, meditation, yoga, organic brands
9 Developer Mono Mono + Sans JetBrains Mono IBM Plex Sans code, developer, technical, precise, functional, hacker Developer tools, documentation, code editors, tech blogs, CLI apps
10 Retro Vintage Display + Serif Abril Fatface Merriweather retro, vintage, nostalgic, dramatic, decorative, bold Vintage brands, breweries, restaurants, creative portfolios, posters
11 Geometric Modern Sans + Sans Outfit Work Sans geometric, modern, clean, balanced, contemporary, versatile General purpose, portfolios, agencies, modern brands, landing pages
12 Luxury Serif Serif + Sans Cormorant Montserrat luxury, high-end, fashion, elegant, refined, premium Fashion brands, luxury e-commerce, jewelry, high-end services
13 Friendly SaaS Sans + Sans Plus Jakarta Sans Plus Jakarta Sans friendly, modern, saas, clean, approachable, professional SaaS products, web apps, dashboards, B2B, productivity tools
14 News Editorial Serif + Sans Newsreader Roboto news, editorial, journalism, trustworthy, readable, informat News sites, blogs, magazines, journalism, content-heavy sites
15 Handwritten Charm Script + Sans Caveat Quicksand handwritten, personal, friendly, casual, warm, charming Personal blogs, invitations, creative portfolios, lifestyle brands
16 Corporate Trust Sans + Sans Lexend Source Sans 3 corporate, trustworthy, accessible, readable, professional, Enterprise, government, healthcare, finance, accessibility-focused
17 Brutalist Raw Mono + Mono Space Mono Space Mono brutalist, raw, technical, monospace, minimal, stark Brutalist designs, developer portfolios, experimental, tech art
18 Fashion Forward Sans + Sans Syne Manrope fashion, avant-garde, creative, bold, artistic, edgy Fashion brands, creative agencies, art galleries, design studios
19 Soft Rounded Sans + Sans Varela Round Nunito Sans soft, rounded, friendly, approachable, warm, gentle Children's products, pet apps, friendly brands, wellness, soft UI
20 Premium Sans Sans + Sans Satoshi General Sans premium, modern, clean, sophisticated, versatile, balanced Premium brands, modern agencies, SaaS, portfolios, startups
21 Vietnamese Friendly Sans + Sans Be Vietnam Pro Noto Sans vietnamese, international, readable, clean, multilingual, ac Vietnamese sites, multilingual apps, international products
22 Japanese Elegant Serif + Sans Noto Serif JP Noto Sans JP japanese, elegant, traditional, modern, multilingual, readab Japanese sites, Japanese restaurants, cultural sites, anime/manga
23 Korean Modern Sans + Sans Noto Sans KR Noto Sans KR korean, modern, clean, professional, multilingual, readable Korean sites, K-beauty, K-pop, Korean businesses, multilingual
24 Chinese Traditional Serif + Sans Noto Serif TC Noto Sans TC chinese, traditional, elegant, cultural, multilingual, reada Traditional Chinese sites, cultural content, Taiwan/Hong Kong markets
25 Chinese Simplified Sans + Sans Noto Sans SC Noto Sans SC chinese, simplified, modern, professional, multilingual, rea Simplified Chinese sites, mainland China market, business apps
26 Arabic Elegant Serif + Sans Noto Naskh Arabic Noto Sans Arabic arabic, elegant, traditional, cultural, RTL, readable Arabic sites, Middle East market, Islamic content, bilingual sites
27 Thai Modern Sans + Sans Noto Sans Thai Noto Sans Thai thai, modern, readable, clean, multilingual, accessible Thai sites, Southeast Asia, tourism, Thai restaurants
28 Hebrew Modern Sans + Sans Noto Sans Hebrew Noto Sans Hebrew hebrew, modern, RTL, clean, professional, readable Hebrew sites, Israeli market, Jewish content, bilingual sites
29 Legal Professional Serif + Sans EB Garamond Lato legal, professional, traditional, trustworthy, formal, autho Law firms, legal services, contracts, formal documents, government
30 Medical Clean Sans + Sans Figtree Noto Sans medical, clean, accessible, professional, healthcare, trustw Healthcare, medical clinics, pharma, health apps, accessibility
31 Financial Trust Sans + Sans IBM Plex Sans IBM Plex Sans financial, trustworthy, professional, corporate, banking, se Banks, finance, insurance, investment, fintech, enterprise
32 Real Estate Luxury Serif + Sans Cinzel Josefin Sans real estate, luxury, elegant, sophisticated, property, premi Real estate, luxury properties, architecture, interior design
33 Restaurant Menu Serif + Sans Playfair Display SC Karla restaurant, menu, culinary, elegant, foodie, hospitality Restaurants, cafes, food blogs, culinary, hospitality
34 Art Deco Display + Sans Poiret One Didact Gothic art deco, vintage, 1920s, elegant, decorative, gatsby Vintage events, art deco themes, luxury hotels, classic cocktails
35 Magazine Style Serif + Sans Libre Bodoni Public Sans magazine, editorial, publishing, refined, journalism, print Magazines, online publications, editorial content, journalism
36 Crypto/Web3 Sans + Sans Orbitron Exo 2 crypto, web3, futuristic, tech, blockchain, digital Crypto platforms, NFT, blockchain, web3, futuristic tech
37 Gaming Bold Display + Sans Russo One Chakra Petch gaming, bold, action, esports, competitive, energetic Gaming, esports, action games, competitive sports, entertainment
38 Indie/Craft Display + Sans Amatic SC Cabin indie, craft, handmade, artisan, organic, creative Craft brands, indie products, artisan, handmade, organic products
39 Startup Bold Sans + Sans Clash Display Satoshi startup, bold, modern, innovative, confident, dynamic Startups, pitch decks, product launches, bold brands
40 E-commerce Clean Sans + Sans Rubik Nunito Sans ecommerce, clean, shopping, product, retail, conversion E-commerce, online stores, product pages, retail, shopping
41 Academic/Research Serif + Sans Crimson Pro Atkinson Hyperlegible academic, research, scholarly, accessible, readable, educati Universities, research papers, academic journals, educational
42 Dashboard Data Mono + Sans Fira Code Fira Sans dashboard, data, analytics, code, technical, precise Dashboards, analytics, data visualization, admin panels
43 Music/Entertainment Display + Sans Righteous Poppins music, entertainment, fun, energetic, bold, performance Music platforms, entertainment, events, festivals, performers
44 Minimalist Portfolio Sans + Sans Archivo Space Grotesk minimal, portfolio, designer, creative, clean, artistic Design portfolios, creative professionals, minimalist brands
45 Kids/Education Display + Sans Baloo 2 Comic Neue kids, education, playful, friendly, colorful, learning Children's apps, educational games, kid-friendly content
46 Wedding/Romance Script + Serif Great Vibes Cormorant Infant wedding, romance, elegant, script, invitation, feminine Wedding sites, invitations, romantic brands, bridal
47 Science/Tech Sans + Sans Exo Roboto Mono science, technology, research, data, futuristic, precise Science, research, tech documentation, data-heavy sites
48 Accessibility First Sans + Sans Atkinson Hyperlegible Atkinson Hyperlegible accessible, readable, inclusive, WCAG, dyslexia-friendly, cl Accessibility-critical sites, government, healthcare, inclusive design
49 Sports/Fitness Sans + Sans Barlow Condensed Barlow sports, fitness, athletic, energetic, condensed, action Sports, fitness, gyms, athletic brands, competition
50 Luxury Minimalist Serif + Sans Bodoni Moda Jost luxury, minimalist, high-end, sophisticated, refined, premiu Luxury minimalist brands, high-end fashion, premium products
51 Tech/HUD Mono Mono + Mono Share Tech Mono Fira Code tech, futuristic, hud, sci-fi, data, monospaced, precise Sci-fi interfaces, developer tools, cybersecurity, dashboards
52 Pixel Retro Display + Sans Press Start 2P VT323 pixel, retro, gaming, 8-bit, nostalgic, arcade Pixel art games, retro websites, creative portfolios
53 Neubrutalist Bold Display + Sans Lexend Mega Public Sans bold, neubrutalist, loud, strong, geometric, quirky Neubrutalist designs, Gen Z brands, bold marketing
54 Academic/Archival Serif + Serif EB Garamond Crimson Text academic, old-school, university, research, serious, traditi University sites, archives, research papers, history
55 Spatial Clear Sans + Sans Inter Inter spatial, legible, glass, system, clean, neutral Spatial computing, AR/VR, glassmorphism interfaces
56 Kinetic Motion Display + Mono Syncopate Space Mono kinetic, motion, futuristic, speed, wide, tech Music festivals, automotive, high-energy brands
57 Gen Z Brutal Display + Sans Anton Epilogue brutal, loud, shouty, meme, internet, bold Gen Z marketing, streetwear, viral campaigns
58 Minimalist Monochrome Editorial Serif + Serif + Mono (Triple Stack) Playfair Display Source Serif 4 monochrome, editorial, austere, typographic, pocket manifest Luxury fashion mobile apps, editorial publications, digital exhibitions, portfol
59 Modern Dark Cinema (Inter System) Sans + Mono Inter Inter dark, cinematic, technical, precision, clean, premium, devel Developer tools, fintech/trading, AI dashboards, streaming platforms, high-end p
60 SaaS Mobile Boutique (Calistoga + Inter) Display Serif + Sans + Mono Calistoga Inter saas, boutique, electric, warm, editorial, bold, premium, fi B2B SaaS mobile, fintech apps, analytics dashboards, marketing tools, operations
61 Terminal CLI Monospace Mono + Mono (Single Family) JetBrains Mono JetBrains Mono terminal, cli, hacker, monospace, matrix, developer, retro-f Developer tools, Web3/blockchain apps, hacker aesthetic, sci-fi games, ARG, secu
62 Kinetic Brutalism (Space Grotesk) Geometric Sans (Single Dominant) Space Grotesk Space Grotesk kinetic, brutalist, aggressive, uppercase, oversized, displa Music/culture apps, sports platforms, brand flagship mobile, performance dashboa
63 Flat Design Mobile (System Bold) Sans + Sans Inter Inter flat, clean, system, bold, geometric, cross-platform, icon, Cross-platform apps, dashboards, system UI, onboarding, marketing pages, informa
64 Material You MD3 (Roboto System) Sans (System Default) Roboto Roboto material design 3, md3, android, google, tonal, friendly, ro Android apps, cross-platform tools, productivity software, data-heavy B2B dashbo
65 Neo Brutalism Mobile (Space Grotesk Heavy) Geometric Sans (Bold-Only) Space Grotesk Space Grotesk neo brutalism, pop art, loud, bold, heavy, stickers, mechani Creative tools, Gen-Z marketing, e-commerce for youth culture, content portfolio
66 Bold Typography Mobile (Inter-Tight Poster) Sans + Serif (Display) + Mono Inter Playfair Display bold typography, editorial, poster, near-black, vermillion, Creative brand flagships, reading platforms, event apps, flash pages, luxury mob
67 Academia Mobile (Cormorant + Crimson + Cinzel) Serif + Book Serif + Engraved (Triple Stack) Cormorant Garamond Crimson Pro academia, library, mahogany, parchment, brass, scholarly, pr Knowledge management apps, scholarly reading tools, personal brand portfolios, R
68 Cyberpunk Mobile (Orbitron + JetBrains Mono) Tech Display + Mono Orbitron JetBrains Mono cyberpunk, neon, glitch, hud, sci-fi, dark, matrix green, ma Gaming companion apps, fintech/crypto, data visualization, dark brand apps, cybe
69 Web3 Bitcoin DeFi (Space Grotesk + Inter + Mono) Geometric Sans + Sans + Mono (Triple) Space Grotesk Inter web3, bitcoin, defi, digital gold, fintech, crypto, trustles DeFi protocols and wallets, NFT platforms, metaverse social apps, high-tech bran
70 Claymorphism Mobile (Nunito + DM Sans) Display Rounded + Geometric Sans Nunito DM Sans claymorphism, clay, rounded, playful, candy, bubbly, soft, 3 Children education apps, teen social, brand mascot apps, creative tools, fintech
71 Enterprise SaaS Mobile (Plus Jakarta Sans) Geometric Sans (Single Family) Plus Jakarta Sans Plus Jakarta Sans enterprise, saas, b2b, professional, indigo, modern, approac B2B SaaS apps, productivity tools, government and finance mobile apps, admin das
72 Sketch Hand-Drawn Mobile (Kalam + Patrick Hand) Handwritten + Handwritten (Dual) Kalam Patrick Hand sketch, hand-drawn, handwriting, human, imperfect, organic, Journaling apps, prototype tools, children's picturebook apps, creative platform
73 Neumorphism Mobile (Plus Jakarta Sans + System) Geometric Sans (System Fallback) Plus Jakarta Sans Plus Jakarta Sans neumorphism, soft ui, monochromatic, cool grey, minimal, phy Smart home controls, minimal tools, aesthetic dashboards, health monitors, brand

Implementation

Classic Elegant

  • Heading: Playfair Display
  • Body: Inter
  • Mood: elegant, luxury, sophisticated, timeless, premium, editorial
  • Best for: Luxury brands, fashion, spa, beauty, editorial, magazines, high-end e-commerce
  • Notes: High contrast between elegant heading and clean body. Perfect for luxury/premium.
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Playfair+Display:wght@400;500;600;700&display=swap');

Modern Professional

  • Heading: Poppins
  • Body: Open Sans
  • Mood: modern, professional, clean, corporate, friendly, approachable
  • Best for: SaaS, corporate sites, business apps, startups, professional services
  • Notes: Geometric Poppins for headings, humanist Open Sans for readability.
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&family=Poppins:wght@400;500;600;700&display=swap');

Tech Startup

  • Heading: Space Grotesk
  • Body: DM Sans
  • Mood: tech, startup, modern, innovative, bold, futuristic
  • Best for: Tech companies, startups, SaaS, developer tools, AI products
  • Notes: Space Grotesk has unique character, DM Sans is highly readable.
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');

Editorial Classic

  • Heading: Cormorant Garamond
  • Body: Libre Baskerville
  • Mood: editorial, classic, literary, traditional, refined, bookish
  • Best for: Publishing, blogs, news sites, literary magazines, book covers
  • Notes: All-serif pairing for traditional editorial feel.
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&family=Libre+Baskerville:wght@400;700&display=swap');

Minimal Swiss

  • Heading: Inter
  • Body: Inter
  • Mood: minimal, clean, swiss, functional, neutral, professional
  • Best for: Dashboards, admin panels, documentation, enterprise apps, design systems
  • Notes: Single font family with weight variations. Ultimate simplicity.
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

Playful Creative

  • Heading: Fredoka
  • Body: Nunito
  • Mood: playful, friendly, fun, creative, warm, approachable
  • Best for: Children's apps, educational, gaming, creative tools, entertainment
  • Notes: Rounded, friendly fonts perfect for playful UIs.
@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600;700&family=Nunito:wght@300;400;500;600;700&display=swap');

Bold Statement

  • Heading: Bebas Neue
  • Body: Source Sans 3
  • Mood: bold, impactful, strong, dramatic, modern, headlines
  • Best for: Marketing sites, portfolios, agencies, event pages, sports
  • Notes: Bebas Neue for large headlines only. All-caps display font.
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Source+Sans+3:wght@300;400;500;600;700&display=swap');

Wellness Calm

  • Heading: Lora
  • Body: Raleway
  • Mood: calm, wellness, health, relaxing, natural, organic
  • Best for: Health apps, wellness, spa, meditation, yoga, organic brands
  • Notes: Lora's organic curves with Raleway's elegant simplicity.
@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&family=Raleway:wght@300;400;500;600;700&display=swap');

Developer Mono

  • Heading: JetBrains Mono
  • Body: IBM Plex Sans
  • Mood: code, developer, technical, precise, functional, hacker
  • Best for: Developer tools, documentation, code editors, tech blogs, CLI apps
  • Notes: JetBrains for code, IBM Plex for UI. Developer-focused.
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600;700&display=swap');

Retro Vintage

  • Heading: Abril Fatface
  • Body: Merriweather
  • Mood: retro, vintage, nostalgic, dramatic, decorative, bold
  • Best for: Vintage brands, breweries, restaurants, creative portfolios, posters
  • Notes: Abril Fatface for hero headlines only. High-impact vintage feel.
@import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&family=Merriweather:wght@300;400;700&display=swap');

Geometric Modern

  • Heading: Outfit
  • Body: Work Sans
  • Mood: geometric, modern, clean, balanced, contemporary, versatile
  • Best for: General purpose, portfolios, agencies, modern brands, landing pages
  • Notes: Both geometric but Outfit more distinctive for headings.
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Work+Sans:wght@300;400;500;600;700&display=swap');

Luxury Serif

  • Heading: Cormorant
  • Body: Montserrat
  • Mood: luxury, high-end, fashion, elegant, refined, premium
  • Best for: Fashion brands, luxury e-commerce, jewelry, high-end services
  • Notes: Cormorant's elegance with Montserrat's geometric precision.
@import url('https://fonts.googleapis.com/css2?family=Cormorant:wght@400;500;600;700&family=Montserrat:wght@300;400;500;600;700&display=swap');

Friendly SaaS

  • Heading: Plus Jakarta Sans
  • Body: Plus Jakarta Sans
  • Mood: friendly, modern, saas, clean, approachable, professional
  • Best for: SaaS products, web apps, dashboards, B2B, productivity tools
  • Notes: Single versatile font. Modern alternative to Inter.
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700&display=swap');

News Editorial

  • Heading: Newsreader
  • Body: Roboto
  • Mood: news, editorial, journalism, trustworthy, readable, informative
  • Best for: News sites, blogs, magazines, journalism, content-heavy sites
  • Notes: Newsreader designed for long-form reading. Roboto for UI.
@import url('https://fonts.googleapis.com/css2?family=Newsreader:wght@400;500;600;700&family=Roboto:wght@300;400;500;700&display=swap');

Handwritten Charm

  • Heading: Caveat
  • Body: Quicksand
  • Mood: handwritten, personal, friendly, casual, warm, charming
  • Best for: Personal blogs, invitations, creative portfolios, lifestyle brands
  • Notes: Use Caveat sparingly for accents. Quicksand for body.
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;600;700&family=Quicksand:wght@300;400;500;600;700&display=swap');

Corporate Trust

  • Heading: Lexend
  • Body: Source Sans 3
  • Mood: corporate, trustworthy, accessible, readable, professional, clean
  • Best for: Enterprise, government, healthcare, finance, accessibility-focused
  • Notes: Lexend designed for readability. Excellent accessibility.
@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@300;400;500;600;700&family=Source+Sans+3:wght@300;400;500;600;700&display=swap');

Brutalist Raw

  • Heading: Space Mono
  • Body: Space Mono
  • Mood: brutalist, raw, technical, monospace, minimal, stark
  • Best for: Brutalist designs, developer portfolios, experimental, tech art
  • Notes: All-mono for raw brutalist aesthetic. Limited weights.
@import url('https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&display=swap');

Fashion Forward

  • Heading: Syne
  • Body: Manrope
  • Mood: fashion, avant-garde, creative, bold, artistic, edgy
  • Best for: Fashion brands, creative agencies, art galleries, design studios
  • Notes: Syne's unique character for headlines. Manrope for readability.
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700&family=Syne:wght@400;500;600;700&display=swap');

Soft Rounded

  • Heading: Varela Round
  • Body: Nunito Sans
  • Mood: soft, rounded, friendly, approachable, warm, gentle
  • Best for: Children's products, pet apps, friendly brands, wellness, soft UI
  • Notes: Both rounded and friendly. Perfect for soft UI designs.
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@300;400;500;600;700&family=Varela+Round&display=swap');

Premium Sans

  • Heading: Satoshi
  • Body: General Sans
  • Mood: premium, modern, clean, sophisticated, versatile, balanced
  • Best for: Premium brands, modern agencies, SaaS, portfolios, startups
  • Notes: Note: Satoshi/General Sans on Fontshare. DM Sans as Google alternative.
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&display=swap');