可变字体为单个文件中的字体提供了一系列动态字体变化。静态字体每个文件只能包含一种字体,而可变字体可以包含多种字体。
例如,如果字体包含五种字体样式(斜体、细体、常规、粗体和黑色),则使用该字体的静态字体文件将需要五个字体文件。相比之下,使用该字体的可变字体版本会将所有五种样式合并到一个文件中。
可变字体还包含轴(单数名词轴),可提供一系列属性自定义。标准轴包括粗细、宽度、光学尺寸和倾斜度,但字体作者还可以提供替代轴以获得更多样式选项。
例如,字体作者不必提供一些预定义的属性(如字体粗细为 300、500 和 700),而是可以设置一个范围,以便用户可以应用细粒度的值(因此,字体粗细为 143 或 629,范围是 100-800)。
在本文中,我们将讨论如何用可变字体版本替换静态字体,如何更改轴,访问以前的轴设置以及开发人员交接。
查看我们的可变字体页面,了解有关轴及其使用方式的更多信息,以及获取更多资源!
注意:如果您使用的是Figma 桌面应用程序,则可以使用计算机上已有的任何字体。如果您在浏览器中使用 Figma,则可以安装 Figma Font Helper来访问本地字体。
替换静态字体
如果您使用的字体包含可变字体版本,则可以用字体的可变字体文件替换您、您的团队或您的组织一直使用的静态字体。
请记住,在 Figma 设计中编辑时,Figma 会从三个不同的来源提取字体:共享字体、本地字体和 Figma 提供的 Web 字体(Google 字体)。
如果同一种字体可从多个来源获得,Figma 将按照以下优先顺序提供字体:
共享字体已上传至组织 →您的设备上安装了本地字体 →Figma 提供的默认网络字体 →
共享字体
谁可以使用此功能
组织和企业计划的用户
组织管理员可以上传和管理组织的共享字体
团队管理员组织中的用户可以上传和管理团队共享的字体。
如果新的可变字体包含您之前的静态字体文件的字体系列,那么 Figma 会询问您是否要用可变字体替换静态字体。
单击替换后,Figma 会从共享字体列表中删除旧的静态字体并使用变量版本。
注意:字体的变量版本可能没有与其静态版本相同的字体样式。
例如,假设您想用可变字体版本替换组织的静态字体(包括浅色、常规、粗体和黑色样式)。但是,可变版本包含除粗体之外的所有样式。在这种情况下,Figma 会保留粗体的静态字体文件以供使用。其余的将由可变字体版本替换。
本地字体
谁可以使用此功能
任何团队或计划中的用户
具有文件编辑权限的用户可以创建和编辑组件。
了解如何在 Figma 中访问本地字体 →
要用可变版本替换静态字体,请确保将可变版本安装到您的设备上。
如果可变字体版本包含旧静态字体的所有系列,则无需采取进一步措施。 Figma 将自动优先使用可变字体而不是静态字体。
但是,如果可变字体版本缺少任何字体系列,您将看到缺少字体的对话框,并且需要选择替换样式 →
Figma 提供的默认字体
如果您一直在使用任何默认字体(例如Google 字体),则转换到可变字体版本取决于字体的最新可变版本。
如果可变字体版本包含所有旧的静态样式,那么替换将是无缝的。
但是,如果可变字体版本缺少任何字体系列,您将看到缺少字体的对话框,并且需要选择替换样式 →
使用可变字体
自定义文本
通过更改各种轴,使用可变字体自定义文本。最常见的选项是粗细、宽度、视觉尺寸、斜体和倾斜度。可变字体的轴取决于字体的作者。
您可以从类型设置面板自定义可变字体文本。有两种方法可以访问这些设置:
右侧边栏
使用可变字体选择文本或文本层。点击从右侧边栏打开类型设置面板。单击变体选项卡。
字体样式选择器
使用可变字体选择文本或文本层。点击打开字体样式下拉菜单。选择可变字体轴...
进入类型设置面板的变量选项卡后,使用滑块和输入框来更改每个轴的值。
提示!将鼠标悬停在类型设置面板中的轴上即可预览属性的外观。
访问常用的轴设置
快速访问之前应用于文本的可变字体设置。这些设置是针对单个字体的,Figma 列出了最常用的轴设置。
选择一个或多个使用可变字体的文本层。点击打开字体样式下拉菜单。选项列在字体系列下方。单击设置即可将其应用于文本。