字体配对

工具基于经典字体搭配规则（例如“无衬线配无衬线”或“衬线配衬线”以保持协调，或者用对比风格制造视觉层次），结合你选择的标题字体属性（字重、字宽、风格标签）自动匹配最合适的正文字体。你只需要在标题下拉框里选一个字体，结果区就会列出多个推荐的正文候选，并附带“协调”或“对比”的搭配说明。如果觉得推荐不对，可以换一个标题再试，或者手动在正文区搜索其他字体。

推荐列表包含的是字体名称，不要求你本地已经安装。本工具是纯前端实现，所有字体预览和配对逻辑都在浏览器内完成，不依赖本地字体库。你看到推荐后，可以直接点击“预览”按钮，工具会用内置的Web字体（来自Google Fonts等公开源）渲染出标题+正文的样张。如果最终决定使用，再去下载或引用对应的字体文件即可。

这个工具主要针对**网页和屏幕阅读场景**设计，推荐时优先考虑屏幕可读性（比如正文字体通常选x-height较高、字怀开阔的无衬线体）。所以很适合公众号、博客、产品页等正文排版。但如果你做的是印刷品（海报、名片），推荐逻辑可能偏保守——因为印刷对衬线体和装饰体的容忍度更高。建议在印刷场景下把推荐结果作为起点，再手动微调。

这是工具的设计意图：**正文的首要任务是保证长文可读性**。花哨字体（手写体、装饰体、极窄体）在字号小、行数多时会让眼睛疲劳。所以当标题选了装饰性强的字体，工具会倾向推荐中性、字面干净的正文字体来平衡视觉，避免整个页面“闹腾”。如果你想走极端风格（比如全手写体），可以手动在正文区搜索，但工具默认不会那样推荐。

“协调”指标题和正文属于同一大类（比如都是无衬线体），字距、笔画粗细接近，整体看起来统一安静，适合长文阅读或正式页面。“对比”指风格有明显差异（比如衬线标题配无衬线正文，或者字重一粗一细），能制造视觉层次，适合标题需要突出、正文需要清爽的页面。选哪个取决于页面目的：阅读为主选协调，营销/引导点击选对比。

工具内置的Web字体库大约有400+常用中英文字体，覆盖了主流无衬线、衬线、手写、展示等类别。如果你反复选到类似的推荐，可能是因为你选的标题字体风格比较接近（比如都是粗无衬线体），工具在“可读性优先”原则下会把候选缩小到少数几个经过验证的正文搭配。如果想看到更多可能性，可以尝试选一个风格跨度大的标题（比如从手写体切换到几何无衬线），推荐列表会有明显变化。

目前工具只提供**预览和推荐**，不自动生成CSS或@font-face代码。推荐结果区会显示字体名称和搭配说明，你可以参考推荐自己去写CSS引用字体。如果你需要直接出代码，可以搭配站内其他工具（如字体代码生成器）使用。后续版本可能增加一键复制CSS的功能，当前阶段建议把推荐结果当作设计参考。

工具推荐的是**英文字体名称**，但在预览时会自动匹配系统默认中文字体（如苹方、微软雅黑）来渲染中文部分。也就是说，最终效果是“你选的英文字体用于英文和数字，系统字体用于中文”。如果你希望正文中英文都用同一款中文字体（比如思源黑体），可以手动在正文搜索框输入中文字体名称，工具会把它加入候选。推荐算法默认优先考虑英文字体，是因为大多数设计场景下英文正文的选择更丰富。