编程字体的定制

发表于 分类于 本文字数： 1.7k 阅读时长 ≈ 6 分钟

谈起编程字体的种类，那可谓是五花八门，程序员们会根据不同的喜好而去选择不同的字体，大牛们甚至干脆自己去魔改或设计新字体。菜鸡如我学习编程几年使用的一直是 Adobe 出品的 Source Code Pro，算是非常经典又美观的一款字体。但是我使用这么些年终究是有一些厌倦了，而且 Source Code Pro 不支持连字始终算是一个不大不小的遗憾，所以最近开始折腾选择新的字体。

名词科普

谈到字体总有一些名词术语绕不过，这里就做一个简单介绍。

TrueType 字体（ttf）

Windows 和 Mac 系统最常用的字体格式，其最大的特点就是它是由一种数学模式来进行定义的基于轮廓技术的字体，这使得它们比基于矢量的字体更容易处理，保证了屏幕与打印输出的一致性。同时，这类字体和矢量字体一样可以随意缩放、旋转而不必担心会出现锯齿。

OpenType 字体（otf）

OpenType 是一种可缩放字型电脑字体类型，是美国微软公司与 Adobe 公司联合开发，用来替代 TrueType 字型的新字型。这类字体的文件扩展名为 .otf 。OpenType 最初发表于 1996 年，并在 2000 年之后出现大量字体。它源于微软公司的 TrueType Open 字型，TrueType Open 字型又源于 TrueType 字型。Adobe 公司已经在 2002 年末将其字体库全部改用 OpenType 格式。

Embedded Open Type 字体（eot）

嵌入字体格式（EOT）是微软开发的一种技术，允许 OpenType 字体嵌入到网页并可以下载至浏览器渲染，浏览器根据 CSS 中 @font-face 的定义，下载，渲染这种 .EOT 后缀的字体文件。这些文件只在当前页活动的状态下，临时安装在用户的系统中。

Web Open Font Format 字体（woff）

相对于 TrueType 和 OpenType ，WOFF（Web 开发字体格式）是一种专门为了 Web 而设计的字体格式标准，它并不复杂，实际上只是对于 TrueType / OpenType 等字体格式的封装，并针对网络使用加以优化：每个字体文件中含有字体以及针对字体的元数据，字体文件被压缩，以便于网络传输，并且不包含任何加密或者 DRM 措施。

SVG (Scalable Vector Graphics) 字体

顾名思义，就是使用 SVG 技术来呈现字体，还有一种 gzip 压缩格式的 SVG 字体 .svgz 。SVG 严格遵从 XML 语法，并用文本格式的描述性语言来描述图像内容，因此是一种和图像分辨率无关的矢量图形格式。

TTC (TrueType Collection) 字体

TTC 字体是 True Type 格式的一个扩展。一个 TTC 文件可以将多个字体文件合并到其中。这些文件有利于合并有许多共同字形的多个字体。

Variable 字体

有人解释它为一个存在多种字体格式单字体文件。一般来说，字体的不同格式，比如斜体、粗细、拉伸存储在分开的单个文件内，而现在，你可以存储多种字体格式在一个 Open Type 可变字体文件内，正因为如此，这个文件相对来说体积会更小。关于可变字体的更详细解释可以参考这篇文章。

Powerline 字体

Powerline 是一款 Vim 的插件，它用到了很多特殊的字符。Powerline Fonts 是一个字体集，本质是对一些现有的字体打包，把 Powerline Icon 字符添加到这些现有的字体里去。

Oblique 与 Italic 字体

Italic 和 Oblique 都是向右倾斜的文字，但区别在于 Italic 是指斜体字，而 Oblique 是倾斜的文字（让没有斜体属性的文字倾斜），对于没有斜体的字体应该使用 Oblique 属性值来实现倾斜的文字效果。

Nerd Fonts

Nerd Fonts 是将许多图标打包进现有的一些字体中，常见的情况是终端字体需要用到 Nerd Fonts，比如我在终端中就使用了 Caskaydia Cove Nerd Font（Cascadia Code）字体。

定制字体

很多字体提供了定制的方法，完全可以根据自己的喜好来调整字体。

Fira Code

Fira Code 可以根据个人喜好更改字体的风格集，我主要修改了 r，&，@，\\，0，以及 * 这几个符号（ss01, ss03, ss05, ss06, zero, cv15），对比可以从官方说明那里查看。

VS Code 设置

在 VS Code 中使用该字体有两种方式：

  1. 使用原版字体
    • "editor.fontFamily": "'Fira Code', ..."
    • "editor.fontLigatures": "'ss01', 'ss03', 'ss05', 'ss06', 'zero', 'cv15'"
  2. 使用自己定制的字体（定制操作见下文）
    • "editor.fontFamily": "'Fira Code Custom', ..."
    • "editor.fontLigatures": true

定制过程

目前 JetBrains 的 IDE 还不支持设置 Stylistic Sets，这是定制字体的主要目的。

  • 利用 Docker 本地编译

    1. 克隆仓库

      1
      git clone --depth 1 git@github.com:tonsky/FiraCode.git

    2. 在 FiraCode 文件夹下运行 docker 命令

      1
      docker run --rm -v "${PWD}":/opt tonsky/firacode:latest ./script/build.sh -f "ss01,ss03,ss05,ss06,zero,cv15" -n "FiraCode Custom"

    3. 生成的字体保存在 distr 文件夹下

  • 通过 OpenType Feature Freezer 在原版字体上进行修改。

    1. 安装

      1
      pip install --upgrade opentype-feature-freezer

    2. 执行命令

      1
      pyftfeatfreeze -n -v -f 'ss01,ss03,ss05,ss06,zero,cv15' -S -U Custom <原字体.ttf> <调整后的字体名.ttf>

    3. 问题：ss06(\\) 在定制字体中无效，原因在这里有相关解释。

  • 继续利用 Docker 打包成 Nerd Fonts

    1. 运行 docker 命令

      1
      docker run --rm -v <之前生成的字体文件夹的绝对路径>:/in -v <打包成 nerd fonts 后的输出文件夹绝对路径>:/out nerdfonts/patcher [Options: -s | -c | -l | -w | --careful]

    2. 问题：GNOME Terminal 中无法使用生成的 Fira Code Custom Nerd Font。

为了简单起见，我写了一些脚本，并把生成后的字体放在 GitHub 的仓库中。

Iosevka

我在纠结字体的过程中找到了一个由国人大佬 Belleve 开发的高度可定制化的字体 Iosevka 。

该字体总共拥有 20 种不同风格集，如 Source Code Pro、Fira Mono、IBM Plex Mono 等，更有趣的一点在于每个字母字符都是可自行定制的，因此完全可以打造一款符合个人喜好的字体。

Iosevka 提供了一个非常方便的定制网站来调整每一个选择，生成字体的操作可以参考文档。我自己定制的字体是在 Iosevka ss09 extended 的基础上又调整了几个字符：D、f、j、t、0、1、4、5、{}、$、% 和 >=。

当然定制的 Iosevka 字体也并非完美的，由于连字符号并不能实现单个定制，所以像 </ 这样的符号并不能实现 Fira Code 字体中的效果。

其它

推荐几个用于选择编程字体的网站：