好的 Google Fonts 字体搭配，能让访客还没意识到字体的存在，就已经读得很顺。先选一款标题字体、一款正文字体，再给两者分工：一款负责个性，另一款负责让长时间阅读保持舒适。下面几组组合都是实用的起点，文末还附一套判断自己搭配好坏的方法。
最快选出 Google Fonts 搭配的方法
别一上来就去翻几百个字体家族，先想清楚这些文字要承担什么任务。
- 正文： 选更低调、更规整的那一款。不管放在段落、图片说明、表单还是导航里，都要清晰好读。
- 标题： 选能定下视觉基调的那一款。衬线体、窄体、几何风格或个性鲜明的字体都可以，前提是在你实际使用的字号下依然好认。
- 品牌文字： Logo 或活动主标题可以更有特色，但别让每一种文字样式都与众不同。品牌字体需要一款靠得住的阅读字体来托底。
真正管用的原则是：有对比，但要收得住。两款字体只在某一个方面有明显差别——衬线与无衬线、窄与宽、正式与随意——同时别让页面看起来像一堆互不相干的字体样张。想要更完整的决策流程，可以看这篇字体搭配公式。
八组值得先试的 Google Fonts 搭配
表中的字体都链接到它们在 Google Fonts 上的最新样张页。定下来之前，你可以先看看有哪些样式可用，再用自己的文字试一试。
| 标题字体 | 正文字体 | 适用场景 | 为什么搭得好 |
|---|---|---|---|
| Playfair Display | Source Sans 3 | 内容媒体网站、作品集、活动页 | 高对比衬线体让标题显得沉稳，带点杂志感；无衬线正文则保持平和。 |
| DM Serif Display | DM Sans | 个人品牌、随笔、产品故事 | 选它们不是因为名字里都有“DM”，而是因为两者比例协调。衬线体添了几分温度，又不会让段落显得花哨。 |
| Fraunces | Manrope | 餐饮美食、生活方式、独立小店 | Fraunces 做大标题时个性鲜明；Manrope 让周围的信息显得干净、现代、有条理。 |
| Space Grotesk | Inter | App、技术产品、数据看板 | 两款都是当代无衬线体，对比比较克制。短标题用 Space Grotesk，信息密集的界面文字用 Inter。 |
| Libre Baskerville | Work Sans | 公益组织、报告、学习资料 | 衬线标题传递出严肃感；无衬线正文让说明性内容读起来更亲切。 |
| Barlow Condensed | Barlow | 体育、音乐、促销活动 | 窄版展示字体带来活力，更宽的同系列字体负责处理细节。窄体只留给短句用。 |
| Bebas Neue | Nunito Sans | 海报、面向年轻人的活动、风格大胆的落地页 | Bebas Neue 本身冲击力强，而且天生全大写。Nunito Sans 能把它中和得恰到好处，行动按钮文案和正文段落都用得上。 |
| Cormorant Garamond | Montserrat | 时尚、美妆、高端内容 | 优雅的衬线体配几何无衬线体，对比一目了然。Cormorant Garamond 要用大字号，细节才有空间显露出来。 |
一组搭配在样张里可能很出彩，放进真实版面却撑不住。测试时要用真实的标题、导航文字、段落、按钮和小号说明文字，别只看占位文本。
按阅读场景选搭配
长文章和学习内容
正文字体优先。读者可能要花好几分钟，读相当于 16 像素大小的段落、引文、列表和链接。标题字体可以有个性，但只让它出现在少数位置：页面标题、章节标题和引言摘句。
这类场景里，Playfair Display 配 Source Sans 3、Libre Baskerville 配 Work Sans 都是稳妥的方向。如果你的项目已经在用 Montserrat，这篇 Montserrat 字体搭配指南给出了更有针对性的备选。
落地页和营销活动
读者会先扫一眼再细读，所以第一个标题需要更醒目的轮廓。窄体或展示字体能帮上忙，但前提是标题够短，留得出呼吸空间。比起两句话的使命宣言，“Join the summer workshop”（参加夏季工作坊）这样的短句更适合用 Barlow Condensed。
按钮、价格细节、表单标签和法律条款，都交给正文字体。视觉冲击力放在页面顶部就够了，不必每一行都用力。
需要鲜明调性的品牌
只做一个让人记得住的字体决定：可以是衬线标题、少见的斜体，或者一个压窄的全大写文字标志。其余部分都保持中规中矩。
举个例子：咖啡馆的店名和活动标题用 Fraunces，菜单、营业时间和预订说明用 Manrope。这样分工既能建立辨识度，又不会让顾客读得吃力。
五分钟搭配测试
只要有两款字体看起来有戏，就用这个小练习测一测。
- 写一个真实的标题，长度六到十个单词。
- 在下面用打算采用的正文字体加一段 60 个单词的段落。
- 再加一个按钮、一个导航标签和一行小号说明文字。
- 分别在预计用到的最大字号和最小字号下查看整组效果。
- 每次只改一个变量：标题字体、正文字体、字重或字号。
然后问自己四个实际问题：
- 不用逐字读完，你能一眼认出标题吗？
- 读了两三行之后，段落还读得轻松吗？
- 两款字体的差别看起来是有意为之，而不是不小心配错了吗？
- 最小的文字够不够朴素，不会跟标题抢风头？
如果最后一个问题的答案是否定的，就做减法。一款没那么有特色的正文字体，通常是更好的选择。
Google Fonts 搭配的常见错误
两款字体都太抢眼。 花哨的衬线体配一款实验性的无衬线展示字体，单看一张截图也许很惊艳，但两种个性互相较劲，层级就乱了。让一款字体来主导。
只靠字重制造对比。 同一字体家族的粗体和常规体，放在极简界面里也许够用，但不一定算得上有说服力的搭配。如果标题和正文之间需要更明显的区分，就换一个字体家族，或者换一种字体分类。
让标题字体去干正文的活。 展示字体本来就是给短短几个词用的。别只因为它在 72 像素下好看，就硬把它塞进大段正文里。
只看分类标签就下决定。 “衬线配无衬线”只是一个起点，不是保证。两款字体可能都符合这两个标签，却在字宽、x 高度、字距或气质上互相打架。把它们放进一段完整的文字样本里看看。
常见问题
两款无衬线的 Google Fonts 字体可以搭配吗？
可以，但要让两者的分工一眼就能看出来。标题用 Space Grotesk、正文用 Inter 就是个好例子：标题更有个性，正文保持中性。别选两款太像的字体，否则读者会以为是样式没统一。
新手做一个网站该用几款字体？
大多数新手项目用两个字体家族就够了：一个用于展示性文字，一个用于阅读性文字。只有当第三款字体有非常明确的用途时（比如专门用来做 Logo）才加进来，而且要放进现有的层级里测一测。
标题一定要用衬线体吗？
不一定。衬线标题只是制造对比的一种方式，不是规定。像 Barlow Condensed 这样的窄体无衬线字体，拉开标题和正文的效果，可能比一款字号或字重没选对的衬线体更明显。
专业网站最稳妥的 Google Fonts 搭配是什么？
先给正文选一款易读的无衬线体，再给标题配一款克制的衬线体，或者更有表现力的无衬线体。想要内容媒体那种精致感，Playfair Display 配 Source Sans 3 很实用；做现代风格的产品界面，Space Grotesk 配 Inter 更合适。
怎么判断一组搭配好不好读？
看你打算用的最小段落字号，而不是标题。如果读的时候会卡顿、认错字母，或者读几行就觉得间距看着累，那就换一款正文字体，或者调整字号层级。最好的搭配，既能保住层级，又能让人轻松读下一句。