Inter 字体部署从选对可变字体文件到启用 OpenType 特性【免费下载链接】interThe Inter font family项目地址: https://gitcode.com/gh_mirrors/in/interInter 是一款为计算机屏幕设计的开源无衬线字体。它的核心交付物是可变字体文件InterVariable.woff2一个文件覆盖 Thin(100) 到 Black(900) 共 9 个字重并附带斜体字符集涵盖拉丁、西里尔、希腊等文种采用 SIL Open Font License 1.1 授权可自由用于商业产品。本文围绕开发者实际会卡住的三个问题展开该用哪个字体文件、网页上如何加载、排版特性如何打开全部以仓库中的真实文件路径为准。先分清字体文件可变字体、静态字体与两种光学尺寸所有成品字体都放在 docs/font-files/ 目录2 个可变 woff2InterVariable.woff2、InterVariable-Italic.woff2、1 个InterVariable.ttf外加 36 个静态 woff2。静态文件按家族分两组Inter文本版Inter-Regular.woff2至Inter-Black.woff2各字重各配一份斜体针对小字号屏幕阅读优化InterDisplay显示版同名结构的 18 个文件为大号标题调整了细节。两族字重的粗细一致真正的区别在光学尺寸可变字体带opsz轴14–32浏览器会按当前字号自动选取合适的切面InterDisplay-*静态文件则固定取opsz32 的那套轮廓。所谓小字更清晰、大字不显细就来自这一层区分。wght 与 opsz 两个轴浏览器能替你处理多少wght100–900与普通的font-weight用法一致中间值还能插值出 430、620 这类非标准字重。opsz则很少有人显式碰正文交给浏览器自动选若某处大标题想强制走显示版轮廓可以直接写死h1 { font-variation-settings: opsz 32; }在网页上部署 Inter自托管字体文件与回退策略最小 font-face可变字体优先静态字体兜底把docs/font-files整个拷进项目的静态资源目录即可。仓库里的 docs/inter.css 已经写好了全部声明——InterVariable可变、Inter静态文本、InterDisplay静态显示三个家族每档字重 100–900并统一使用font-display: swap。手工版最小片段如下font-face { font-family: InterVariable; font-weight: 100 900; font-display: swap; src: url(font-files/InterVariable.woff2) format(woff2); } :root { font-family: InterVariable, Inter, sans-serif; }用supports (font-variation-settings: normal)检测能力在不支持可变字体的旧浏览器上整体切回Inter家族是最省事的回退写法。字重映射与请求次数静态方案下浏览器按font-weight数值匹配具体文件可变方案下 1 个文件覆盖全部字重。如果只面向现代浏览器只部署可变文件请求次数直接减到一两个若必须兼容旧环境保留静态文件但只引入实际用到的字重不要整目录全上。打开排版细节Inter 的 OpenType 特性特性源码集中在 src/features/每个.fea文件对应一个可开关项。斜杠零、表格数字与上下文标点日常最常用的两项.code { font-feature-settings: zero 1; } /* 零字带斜杠区分 0 与 o */ .table { font-feature-settings: tnum 1; } /* 表格数字等宽对齐成列 */上下文替换calt由浏览器默认启用引号、连字符等标点会依据相邻字形自动换形状无需任何配置。cv01 到 cv1414 组单字符替换这一组对应具体字母的备选字形例如cv01的1、cv02的4、cv05的带尾 l、cv11的单层 a、cv12的紧凑 f。效果样例见 src/features/ 下各文件的命名如cv11-single-storey-a.fea网页中用font-feature-settings: cv11 1打开。桌面安装与一个容易踩的版本坑在 Windows、macOS、Linux 上安装Windows右键InterVariable.ttf选择安装。装 TTF 而非 woff2后者是 Web 格式系统不认macOS双击.ttf用字体册安装Linux包管理器最省事sudo apt install fonts-interDebian/Ubuntu或brew install --cask font-inter手动安装则把 TTF 放入~/.local/share/fonts/后执行fc-cache -f。别用上过时的 Inter 版本README 明确提醒Google Fonts 上托管的 Inter 版本较旧且没有斜体。如果你的站点现在引的是那份换成本仓库当前版本version.txt 为 4.1值得一次替换。授权边界也要留意Inter 可随商业产品分发嵌入但不能单独出售字体本身Inter 是保留名称衍生字体不可沿用。下一步git clone https://gitcode.com/gh_mirrors/in/inter把docs/font-files拷进项目在浏览器里确认各字重与斜体渲染正常最后挑zero、tnum、cv11中的两三个落到代码区、数据表等具体模块里验证效果。【免费下载链接】interThe Inter font family项目地址: https://gitcode.com/gh_mirrors/in/inter创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考