企业官网建设流程全解析

Plus Jakarta Sans 开源字体完整上手攻略：零基础安装、商用授权与网页引入一次讲透

【免费下载链接】PlusJakartaSans+Jakarta Sans is a open-source fonts. Designed for Jakarta "City of collaboration" program in 2020.项目地址: https://gitcode.com/gh_mirrors/pl/PlusJakartaSans

如果你正在为网站、App 或 PPT 找一款"免费、能商用、还不显廉价"的字体，那么 Plus Jakarta Sans 开源字体值得你花三分钟认识一下。它诞生于 2020 年印尼雅加达的城市品牌项目，由专业字体工作室 Tokotype 设计，覆盖 7 种字重、提供 OTF / TTF / WOFF2 / 可变字体四种格式，并采用 SIL 开源协议允许商业使用——这样的配置在免费字体里相当少见。下面这篇攻略会从它为什么值得用讲起，一步步带你完成安装、网页引入和进阶玩法。

一座"协作之城"，如何长出一套现代字体

2020 年，雅加达市政府发起 "+Jakarta City of Collaboration"（协作之城）品牌计划，希望用一套统一的视觉语言展示这座城市的开放与活力。设计师 Gumpita Rahayu 所在的 Tokotype 工作室为此创作了 Plus Jakarta Sans——一款以城市命名、为协作而生的几何无衬线字体。

它的设计灵感来自 Neuzeit Grotesk、Futura 以及 1930 年代的 grotesque 字体：笔画近乎单线、曲线锐利挺拔，整体是干净利落的现代切割形态。与此同时，它把 x-height（字干高度）略微拉高，配上开放的字怀与均衡的字距，让小字号下的正文、大字号下的标题都能保持清晰易读。

最有趣的设计藏在细节里：这套字体专门内置了三种风格化变体——Lancip（尖锐）、Lurus（直线）和 Lingkar（卷曲）。同一句话可以呈现出截然不同的性格，就像雅加达这座城市一样多元，这在整个开源字体圈都称得上独一份。

和免费字体里的"老面孔"相比，它凭什么值得用

很多免费字体要么只有两三个字重、要么授权含糊不清、要么中文缺字严重。Plus Jakarta Sans 开源字体则把常见痛点一次性解决：

它的核心亮点可以浓缩成这五条：

• ✅7 字重 × 双样式：从 ExtraLight 到 ExtraBold，每款都带斜体，14 个文件构成完整家族；
• ✅四种格式全覆盖：桌面用 TTF/OTF，网页用 WOFF2，追求极致灵活用可变字体；
• ✅商业友好：SIL Open Font License 1.1，产品、网站、App 均可免费商用；
• ✅多语言字符集：基于 GF Latin Pro 与 GF Latin Plus 编码标准，越南语等语种也能正常排版；
• ✅可变字体加持：一条 wght 轴即可在 200~800 之间连续调节字重，无需切换文件。

零基础 3 步：把 Plus Jakarta Sans 开源字体装进你的系统

第 1 步：拿到字体文件

开发者可以直接克隆仓库：

git clone https://gitcode.com/gh_mirrors/pl/PlusJakartaSans

如果只是日常使用，也可以进入仓库的fonts/ttf/目录，直接挑选需要的.ttf文件下载，不必克隆整个工程。

第 2 步：按平台安装

Windows 用户：进入fonts/ttf/目录，全选字体文件 → 右键 → 点击"安装"。稍等片刻即可完成，重启 Word、Photoshop 等应用后就能在字体列表里看到它。

macOS 用户：双击任意.ttf或.otf文件，系统会打开"字体册"，点击右下角"安装字体"，立即生效、无需重启。

Linux 用户：更推荐命令行方式，一次性完成复制与缓存刷新：

mkdir -p ~/.local/share/fonts/PlusJakartaSans cp fonts/ttf/*.ttf ~/.local/share/fonts/PlusJakartaSans/ fc-cache -fv ~/.local/share/fonts

第 3 步：验证是否安装成功

Linux 上可以用fc-list检查；Windows 和 macOS 则直接在文字处理软件的字体下拉框中搜索 "Plus Jakarta Sans"：

fc-list | grep "Plus Jakarta"

上图展示了这款字体从超轻到粗体的字重跨度。日常使用建议从 Regular 和 Bold 入手，这两个字重足以覆盖 80% 的设计场景；熟悉之后再逐步尝试其他字重和斜体。

进阶玩法拆解：网页、可变字体与构建的 3 个实战场景

场景一：网页引入，让站点立刻"高级起来"

网页端请优先使用fonts/webfonts/目录下的 WOFF2 文件，压缩率高、现代浏览器支持好。用@font-face声明字体并应用到全站：

@font-face { font-family: 'Plus Jakarta Sans'; src: url('fonts/webfonts/PlusJakartaSans-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; } body { font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif; line-height: 1.6; }

效果：正文更清爽、标题更有记忆点。记得只引入用到的字重、给字体链接加preload，并把系统字体写在回退列表末尾，加载体验会更稳。

场景二：可变字体，一条轴玩转整个字重家族

fonts/variable/目录下提供了PlusJakartaSans[wght].ttf，通过 CSS 的font-variation-settings即可实现字重的连续调节，甚至配合过渡动画：

@font-face { font-family: 'Plus Jakarta Sans Variable'; src: url('fonts/variable/PlusJakartaSans[wght].ttf') format('truetype'); font-weight: 200 800; } .heading:hover { font-variation-settings: 'wght' 800; transition: font-variation-settings 0.3s ease; }

效果：一个文件替代 7 个静态文件，悬停时字重平滑"加粗"，交互感十足，页面加载也更轻量。

场景三：想定制字体？官方工具链帮你构建

仓库提供了完整的构建与质检脚本。克隆工程后安装依赖，即可自行重新生成字体：

gftools builder sources/config.yaml fontbakery check-googlefonts fonts/variable/*.ttf fontbakery check-googlefonts fonts/ttf/*.ttf

效果：构建命令输出 OTF、TTF、WOFF2 与可变字体；fontbakery会按 Google Fonts 规范逐项体检，帮你在发布前发现质量隐患。

新手最常踩的 5 个坑，官方答案一次说清

Q1：装完字体，软件里却找不到？A：绝大多数文字处理软件只会在启动时扫描字体。请完全退出 Word、PPT 或设计软件再重新打开；Linux 上则先确认fc-cache已刷新。

Q2：OTF、TTF、WOFF2 到底该用哪个？A：桌面软件用fonts/ttf/（兼容性最好）；网页用fonts/webfonts/里的 WOFF2；做可变字重实验用fonts/variable/。按场景选格式，别混用。

Q3：商业项目真的能免费使用吗？A：可以。项目采用 SIL Open Font License 1.1（见 OFL.txt），允许将字体用于商业产品、网站和应用，也允许修改与再分发，只要保留许可声明即可。

Q4：可变字体打开后字重还是只能选固定的几个？A：检查是否真的加载了fonts/variable/下的文件，并确认font-weight: 200 800的声明范围写对。静态文件无法连续调重，只有可变字体可以。

Q5：如何获取最新版本？A：留意仓库中的 FONTLOG.txt 更新日志，或定期git pull拉取最新提交，字体会持续修正字距、垂直度量等问题。

最后一步：现在就把它用起来

• 📌先装两件套：把 Regular 和 Bold 安装进系统，替换你日常文档的默认字体；
• 📌再试一次网页引入：按上文场景一的代码，给你的个人站点加一套 WOFF2；
• 📌最后玩一把可变字体：在悬停动效里体验 200→800 的字重过渡，感受它的弹性。

好的字体是投入最低、回报最直观的设计升级。Plus Jakarta Sans 开源字体已经替你省掉了授权成本和技术门槛，剩下的就交给你的创意了——现在就下载安装，让它成为你下一个作品里最耐看的细节吧。

【免费下载链接】PlusJakartaSans+Jakarta Sans is a open-source fonts. Designed for Jakarta "City of collaboration" program in 2020.项目地址: https://gitcode.com/gh_mirrors/pl/PlusJakartaSans