开源字体库上手指南：3 步从 9 个字体家族中挑出你最需要的
开源字体库上手指南3 步从 9 个字体家族中挑出你最需要的【免费下载链接】fontsMy favorite fonts: SF Pro Text, Pingfang SC, Avenir Next, Roboto, Uber and more.项目地址: https://gitcode.com/gh_mirrors/font/fonts即将配好新编辑器时你想给代码配一款 JetBrains Mono再配一款干净的中文正文字体可是字体文件散落在各个网站能否商用也没底。fonts 这个开源字体库把 9 个常用字体家族装进一个仓库一次 clone 全部带走。适合想快速建立本地字体库的开发者以及需要自托管网页字体的前端同学。项目全景fonts 是什么fonts 是一份字体精选清单作者把 9 个字体家族按目录分好每个目录里都是可直接安装或引用的字体文件。核心特性9 个字体家族编程等宽、中文、经典无衬线、终端字形都覆盖多格式开箱即用桌面用 TTF/OTF/TTC网页用 WOFF/WOFF2中文字重齐全Noto Sans CJK 7 个字重Noto Serif CJK 6 个字重支持变量字体JetBrains Mono 一个文件覆盖 100-800 字重许可宽松仓库整体 MITJetBrains Mono 为 SIL OFL商用无负担快速体验3 步克隆并安装 其实三步就能让开源字体库发挥作用。第一步克隆仓库看目录结构git clone https://gitcode.com/gh_mirrors/font/fonts cd fonts ls这一步做完你会看到 9 个字体目录和 LICENSE 许可文件每个目录对应一个字体家族。第二步把字体装进系统Linux 一行完成mkdir -p ~/.fonts cp -r JetBrainsMono-2/fonts/ttf/* ~/.fonts/ fc-cache -fv这一步做完编辑器字体下拉框里会出现 JetBrains Mono。macOS 直接双击任意 ttf 文件字体会经字体册自动安装Windows 选中字体文件后右键为所有用户安装。第三步在网页项目中引用font-face { font-family: JetBrains Mono; src: url(JetBrainsMono-2/fonts/webfonts/JetBrainsMono-Regular.woff2) format(woff2); font-weight: 400; } body { font-family: JetBrains Mono, monospace; }这一步做完页面代码块会以 JetBrains Mono 渲染。woff2 是压缩后的网页字体格式加载体积最小。能力拆解4 组字体家族模块 编程等宽JetBrains Mono 全家桶JetBrainsMono-2/ 是仓库里最完整的目录分三层存放。是什么Thin 到 ExtraBold 全套静态字重含斜体与无连字 NL 版本另有两个变量字体覆盖 100-800 字重和 15 个网页 woff2 字体。在哪找静态字体在 JetBrainsMono-2/fonts/ttf/变量字体在 JetBrainsMono-2/fonts/variable/网页字体在 JetBrainsMono-2/fonts/webfonts/。怎么用桌面装 ttf 即可网页引用 woff2变量字体只加载一个文件再用 CSS 动态调整字重。中文黑体与宋体Noto CJK 双目录两个中文目录是开源字体库里的中文核心全部带 hinting小字号下依然清晰。是什么Noto Sans CJK 含 Thin 到 Black 共 7 个字重外加 2 个等宽版本Noto Serif CJK 含 6 个字重。黑体适合正文宋体适合排版阅读。在哪找NotoSansCJKsc-hinted/ 和 NotoSerifCJKsc-hinted/。怎么用正文装 NotoSansCJKsc-Regular.otf阅读场景换 Serif中文需要等宽显示时选 CJK Mono 版本。经典无衬线Avenir Next 等 5 个家族Avenir Next 是仓库中唯一带 woff/woff2 全套网页格式的组合。是什么Avenir Next 从 Regular 到 Bold 共 4 个字重另有 Arial、Helvetica、HelveticaNeue、Menlo 四个家族做本地补充。在哪找Avenir Next/、Arial/、Helvetica/、HelveticaNeue/、Menlo/。怎么用网页引用 Avenir Next 子目录里的 woff2其余以 ttf/ttc 为主装进系统当后备字体。终端字体MesloLGS-NFMesloLGS-NF 是带 Nerd Font 字符的 Meslo 变体专给终端状态栏用。是什么终端里的 powerline 状态栏和图标字符依赖 Nerd Font这个家族含 Regular、Bold、Italic、Bold Italic 四个版本。在哪找MesloLGS-NF/共 4 个文件。怎么用在 iTerm2 等终端里把字体名设为 MesloLGS NF状态栏就不会再出现方块。实战场景3 组现成搭配三个最常见场景从开源字体库里直接挑组合场景英文字体中文字体格式与来源代码编辑器JetBrains Mono RegularNoto Sans CJK Regularttf 装入系统网页代码展示JetBrains Mono RegularNoto Sans CJK Monowoff2 自托管博客长文阅读Avenir NextNoto Serif CJK按需选 woff2 或 otf记住这一点中英文不必用同一款字体各选一款无衬线、字重对齐混排效果就稳定。收尾现在就能做说白了这个开源字体库解决的是字体从哪找、商用安不安心的问题9 个字体家族覆盖编程、中文与网页场景一次克隆全部到手。建议今晚先跑一遍快速体验里的克隆命令把最常用的两款 JetBrains Mono Regular 和 Noto Sans CJK Regular 装上编辑器里立刻见效。完整许可条款见 LICENSE。【免费下载链接】fontsMy favorite fonts: SF Pro Text, Pingfang SC, Avenir Next, Roboto, Uber and more.项目地址: https://gitcode.com/gh_mirrors/font/fonts创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考