如何使用

1. 从 18 款系统字体与常用网络字体名中，选标题字体和正文字体各一款。
2. 设置基础字号（10 到 32 像素），正文样例按该字号渲染。
3. 选字号比例：1.125、1.2、1.25、1.333、1.414、1.5 或 1.618。
4. 选正文行高：1.3、1.5、1.6 或 1.8。
5. 点常用配对推荐按钮可直接套用常见组合，如 Playfair Display 配 Lato。
6. 看实时预览，然后从输出卡片复制 CSS 变量与规则。

常见用途

• 站点排版体系：写组件 CSS 前先定标题字体、正文字体与比例尺。
• 落地页改版：不改样式表就能对比衬线展示体与中性无衬线的效果。
• 文档与博客主题：让各模板的 h1、h2 与正文字号保持一致。
• 排版教学：演示改一个比例系数如何同时改变所有标题字号。
• 快速设计评审：几秒换一对字体，保留读起来舒服的字号。

为何保证隐私

字体名与字号在本页面内拼成 CSS 字符串，不上传任何数据，不请求任何字体文件，工具可离线使用。

常见问题

问：预览的字体会从 Google Fonts 加载吗？ 答：不会。工具只生成字体栈，预览用的是本机已安装的字体。Inter、Montserrat 等名字在你自己的站点加载字体文件前，会以本地回退字体显示；复制出去的 CSS 也假设由你提供字体文件。

问：字体栈里有什么？ 答：每次选择都会生成一层栈：首选字体、同族回退字体、CSS 通用关键字（serif、sans-serif 或 monospace），字体缺失时文字依然可读。

问：标题字号怎么算的？ 答：h2 = 基础字号 × 比例，h1 = 基础字号 × 比例 × 比例 × 比例，四舍五入到整像素。改比例会同时移动所有标题。

问：先从哪一对开始？ 答：推荐按钮提供常见组合：衬线展示体配中性无衬线正文，或几何无衬线配人文无衬线。角色上形成对比、气质上保持一致；标题显得跳时，先把比例调小。