菜单

字符变体与风格集

相关源文件

目的与范围

本文档解释了 Fira Code 字体中可用的字符变体和风格集。这些功能为特定字符和字符组合提供了替代字形设计,允许根据个人偏好或可读性要求进行自定义。本页专门介绍替代字符形式和样式选项,而非连字功能(有关连字信息,请参阅 连字和编程符号)。

概述

Fira Code 提供两种 OpenType 机制用于字形自定义

  1. 字符变体 (cv01-cv32):单个字形(如 agi 等)的替代形式。
  2. 风格集 (ss01-ss10):可以作为一组应用样式修改的集合。

这些功能增强了字体的灵活性,允许开发人员调整特定字符的外观以匹配其偏好,而无需更改整个字体。

来源: CHANGELOG.md44-67

字符变体 (cv01-cv32)

Fira Code 中的字符变体为单个字符提供了替代设计。每个变体都由一个代码(cv01、cv02 等)标识,并且可以独立于其他变体激活。

可用的字符变体

来源: CHANGELOG.md46-67 FiraCode.glyphs1-155

字母变体

Fira Code 为几个小写字母提供了替代形式

变体描述添加于
cv01替代小写字母 'a'6.0
cv02替代小写字母 'g'6.0
cv03-cv06四种替代小写字母 'i' 的形式6.0
cv07-cv10四种替代小写字母 'l' 的形式6.0

字母变体提供了不同的样式选择,可以提高可读性或匹配特定的美学偏好。例如,替代字母 'a' (cv01) 具有比默认双层结构 'a' 更传统的单层结构设计。

来源: CHANGELOG.md46-49

数字变体

Fira Code 为某些数字提供了替代形式

变体描述添加于
cv11-cv13三种替代的 '0'(零)样式6.0
cv14替代的 '3'6.0

数字变体包括斜杠或点状零的不同样式,这有助于区分 '0' 和 'O',以及数字 '3' 的替代形式。

来源: CHANGELOG.md50-51

符号和运算符变体

Fira Code 为编程符号和运算符提供了多种变体

变体描述添加于
cv15顶部对齐的星号 '*'6.0
cv16六边形星号 '*'6.0
cv17顶部对齐的波浪号 '~'6.0
cv18替代的百分号 '%'6.0
cv19带水平线的“小于等于”6.0
cv20表示为箭头的“小于等于”6.0
cv21表示为“小于等于”的“等于-小于”6.0
cv22带水平线的“等于-小于”6.0
cv23带水平线的“大于等于”6.0
cv24表示为 '/=' 的“不等于”6.0
cv25替代的点-连字符 '.-'6.0
cv26替代的冒号-连字符 ':-'6.0
cv27替代的方括号 '[]'6.0
cv28花点符号 '{. .}'6.0
cv29替代的花括号 '{}'6.0
cv30长横线/管道符 ''
cv31替代的圆括号 '()'6.0
cv32替代的点-等于 '.='6.0

这些变体为常见的编程符号和运算符提供了替代选项,这些选项可能在不同的上下文或编程语言中更受欢迎。

来源: CHANGELOG.md52-67

风格集 (ss01-ss10)

风格集是字形替代的集合,可以一起应用。Fira Code 包含多个修改特定字符组的风格集。

可用的风格集

来源: CHANGELOG.md188-196 CHANGELOG.md66

风格集详情

集合描述添加于
ss01替代小写字母 'r'2.0
ss02替代的关系运算符 '<=' 和 '>='2.0
ss03替代的“和”号 '&'2.0
ss04替代的美元符号 '$'2.0
ss05替代的“at”符号 '@'2.0
ss06细反斜杠 '\'2.0
ss07修改的 '=' 和 '!' 运算符3.0
ss08在相等运算符 '==' '===' '!=' '!==' 中添加间隙5.0
ss09C 风格复合赋值运算符 ('>>=', '<<=', '||=', '|=')6.0
ss10对 'Fl', 'Tl', 'fi', 'fj', 'fl', 'ft' 的传统连字6.0

与修改单个字形的字符变体不同,风格集通常用一个设置影响多个相关字形或连字。

来源: CHANGELOG.md188-196 CHANGELOG.md39-42 CHANGELOG.md66

字符变体与风格集

来源: FiraCode.glyphs1-155 CHANGELOG.md44-67

字符变体与风格集之间的主要区别

  1. 范围:字符变体通常影响单个字形,而风格集可能会影响多个相关的字形。

  2. 命名约定:字符变体使用 'cv' 前缀和两位数字(cv01-cv32),而风格集使用 'ss' 前缀(ss01-ss10)。

  3. 目的:字符变体提供特定字符的替代设计,而风格集为字符组提供更广泛的样式选择。

  4. 技术实现:两者都利用 OpenType 功能,但在字体文件中实现为不同的功能类型。

字体定义中的实现

字符变体和风格集在字体的 OpenType 功能表中定义。从字体定义系统中查看它们的表示方式

来源: FiraCode.glyphs1-155

在字体定义文件中,替代字形用与其功能对应的后缀定义。例如:

  • 字符变体 1 中的替代字母 'a' 使用 a.cv01
  • 风格集 1 中的替代字母 'r' 使用 r.ss01

OpenType 功能系统将这些替代字形连接到相应的功能标签,允许渲染引擎在激活功能时用替代字形替换默认字形。

激活字符变体和风格集

如何激活这些功能取决于您的环境

在 CSS (Web) 中

可以使用 font-feature-settings CSS 属性激活字符变体和风格集。

在代码编辑器中

不同的代码编辑器激活 OpenType 功能的方法不同

  • VS Code:修改 settings.json 以包含字体功能设置。
  • JetBrains IDE:使用字体首选项。
  • Sublime Text:在首选项文件中配置字体设置。

在设计软件中

在 Adobe Illustrator、Adobe Photoshop 或 Figma 等设计软件中,通常可以通过 OpenType 功能面板或字符面板访问字符变体和风格集。

视觉参考

激活后,字符变体和风格集会修改特定字形的外观。以下是一些可用变体的简化视觉表示:

Character Variants Examples:
a (default) vs a (cv01)
g (default) vs g (cv02)
i (default) vs i (cv03) vs i (cv04) vs i (cv05) vs i (cv06)
l (default) vs l (cv07) vs l (cv08) vs l (cv09) vs l (cv10)
0 (default) vs 0 (cv11) vs 0 (cv12) vs 0 (cv13)
3 (default) vs 3 (cv14)
* (default) vs * (cv15) vs * (cv16)
~ (default) vs ~ (cv17)
% (default) vs % (cv18)
Stylistic Sets Examples:
r (default) vs r (ss01)
<= (default) vs <= (ss02)
& (default) vs & (ss03)
$ (default) vs $ (ss04)
@ (default) vs @ (ss05)
\ (default) vs \ (ss06)

来源: extras/character_variants_es.png extras/ligature_variants.png

字符变体和风格集的演变

Fira Code 随时间推移逐步添加了更多字符变体和风格集

  • 2.0 版本:引入了风格集 ss01-ss06。
  • 3.0 版本:添加了 ss07。
  • 5.0 版本:添加了 ss08。
  • 6.0 版本:添加了大部分字符变体 (cv01-cv32) 和风格集 ss09-ss10。

这种演变反映了社区对自定义特定字符外观以匹配个人偏好和提高代码可读性日益增长的兴趣。

来源: CHANGELOG.md188-196 CHANGELOG.md39-42 CHANGELOG.md46-67

结论

字符变体和风格集为 Fira Code 用户提供了强大的自定义选项。通过激活特定的 OpenType 功能,开发人员可以根据自己的偏好调整字体外观,从而提高代码环境的可读性和美观性。

与 Fira Code 的连字功能结合使用时,这些自定义选项使其成为一种高度灵活且个性化的编码字体。