IBM Plex 字体项目技术文档

2026-01-25 06:25:09作者：凤尚柏Louis

安装指南

在个人设备上安装

要将 IBM Plex 字体添加到您的设备，请执行以下步骤：

访问 IBM Plex 的 GitHub 发布页面，下载最新的 .zip 文件。
解压缩下载的文件，并找到字体文件(.ttf 或 .otf)。
双击每个字体文件，在弹出的预览窗口中点击“安装”，以将其安装到您的系统中。

Web 使用的安装

对于Web开发，可以通过以下方法之一添加IBM Plex字体：

通过npm安装:
```
npm install @ibm/plex
```
然后在您的CSS中使用相应的路径引入字体。
手动安装: 下载Web使用的.zip文件，解压并将字体文件以及提供的CSS文件一同上传至服务器，保持目录结构不变。

项目的使用说明

HTML 中使用

可以直接通过<link>标签引用托管的CSS文件，或者在项目中引入下载的CSS文件，然后使用定义好的font-family来应用字体。

示例：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="path/to/css/ibm-plex.css">
<style>
body {
  font-family: 'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif;
}
.code-block {
  font-family: 'IBM Plex Mono', 'Courier New', monospace;
}
</style>
</head>
<body>
常规文本示例...

<code class="code-block">代码块文本示例...</code>
</body>
</html>

Node.js 项目中的集成

对于基于Node.js的项目，安装了@ibm/plex之后，可以在CSS或SCSS中通过导入来使用：

$font-prefix: './node_modules/@ibm/plex/dist/fonts'; // 根据实际路径调整
@import '@ibm/plex/scss/ibm-plex';

/* 使用字体 */
.my-class {
  font-family:IBM Plex Sans, helvetica, arial, sans-serif;
}

项目API使用文档

IBM Plex作为字体项目，其“API”主要是通过CSS类和属性进行交互。具体使用时，只需遵循CSS规范中设置font-family的方式即可。例如，不需要特别的调用方法，而是通过CSS选择器指定字体族。

/* 示例CSS类 */
.plex-sans {
  font-family: 'IBM Plex Sans', sans-serif;
}

项目构建指南（开发者）

构建前提条件

FontLab Studio 5: 用于编辑和导出字体源文件。
RoboFab Library: 提供Python脚本支持。
Adobe Font Development Kit for OpenType (AFDKO): 必须安装，用于从FontLab导出的文件生成最终的OTF或TTF字体文件。

构建单个字体步骤

运行FontLab中的IBM Plex export FDK files.py脚本，指向IBM Plex的.vfb源文件目录。
脚本会在目标目录下创建一个名为fdk的文件夹，包含每个字体的子目录及其所需的AFDKO文件。
使用AFDKO工具集中的makeotf命令从这些文件中生成OpenType字体文件。

makeotf -f fdk/SubDirectory/FontName.fontlab

确保替换SubDirectory和FontName为您实际的目录名和字体名称。

通过以上步骤，您可以轻松地在不同场景下使用和集成IBM Plex字体，无论是提升网页的视觉体验还是在应用程序中营造统一的品牌形象。

plex

The package of IBM’s typeface, IBM Plex.

项目地址：https://gitcode.com/gh_mirrors/pl/plex

登录后查看全文