Vercel 推出 Geist Pixel：面向现代产品的像素字体系统扩展

4 分钟阅读

2026 年 2 月 6 日

今天，我们为 Geist 字体家族新增了 Geist Pixel。

Geist Pixel 是一款受位图字体启发的字型，构建在与 Geist Sans 和 Geist Mono 相同的基础之上，并通过严格的像素网格进行重新诠释。它精准、有意图，并且毫不掩饰其数字化气质。

Link to heading同一系统，全新肌理

Geist Pixel 不是一款“新奇字体”，而是系统的扩展。

就像 Geist Mono 是为开发者打造的一样，Geist Pixel 也从真实使用场景出发设计。它不是视觉噱头，而是更大字体系统中的功能性工具。

它包含 5 个彼此区分的变体，并分别单独导出：

Geist Pixel Square
Geist Pixel Grid
Geist Pixel Circle
Geist Pixel Triangle
Geist Pixel Line

每个字形都构建在一致的像素网格上，并经过精细调校，以保持节奏、间距和可读性。最终效果既有怀旧感又具当代气息：根植于早期屏幕排版，却为面向真实用户发布的现代产品而设计。

这很重要，因为像素字体在生产环境中常常会“翻车”：无法在不同 viewport 中正确缩放、度量与现有排版体系冲突，或者只能作为装饰。Geist Pixel 的目标正是解决这些问题——在保留团队想要的视觉肌理同时，维持产品所需的排版严谨性。

它与其他 Geist 家族成员共享同样的核心原则：

清晰的结构
可预测的度量
跨布局的强对齐能力
可在不同平台与使用场景中扩展

Link to heading上手非常简单

通过 Get started with Geist Pixel 开始构建。可直接安装：

code

npm i geist

导出项与 CSS 变量：

GeistPixelSquare: --font-geist-pixel-square
GeistPixelGrid: --font-geist-pixel-grid
GeistPixelCircle: --font-geist-pixel-circle
GeistPixelTriangle: --font-geist-pixel-triangle
GeistPixelLine: --font-geist-pixel-line

并在 layout.tsx, 中使用，例如 GeistPixelSquare：

app/layout.tsx

code

import { GeistPixelSquare } from "geist/font/pixel";export default function RootLayout({ children }) { return (       <html lang="en" className={GeistPixelSquare.variable}>     <body>{children}</body>    </html>   );}

更多信息请参见 README。

Link to heading为 Web 与现代产品而设计

许多像素字体更偏表达性，而 Geist Pixel 的目标是可发布、可落地。它可用于真实 UI 场景：横幅、仪表盘、实验性布局、产品关键展示时刻，以及那些将排版作为界面语言一部分的系统。

以下方面经过了特别打磨：

与 Geist 和 Geist Mono 对齐的垂直度量
一致的 cap height 与 x-height 表现
面向不同密度与使用场景的多种变体
与 Geist 家族其他字体的无缝混排

它为 Web 而生，为现代产品而生，也面向一个由 AI 驱动工作流不断塑造界面的时代。

Link to heading网格中构建，手工打磨

尽管 Geist Pixel 基于网格，但它并非机械生成。

每个字形都经过手工微调，以避免视觉噪点、笔画权重分布不均和生硬的斜线。设计团队逐像素调整了转角、曲线与过渡，使其在小字号下保持清晰，在大字号下保持个性。横向度量采用 semi-mono 思路，字形同时借鉴了其 Mono 与 Sans 对应字体。约束不是限制，而是设计工具。

Geist Pixel 提供：

5 个变体
480 个字形
7 组风格集
支持 32 种语言

它以与 Geist、Geist Mono 相同的系统化思维构建，因此可轻松接入，而不破坏布局与排版节奏。

Link to heading已经在塑造下一步

即使在公开发布之前，Geist Pixel 也已经开始影响 Vercel 的视觉语言。几周前在内部共享后，它已进入多个探索、实验和早期重设计工作，持续塑造产品的语气、肌理与表达。从很多角度看，它已经是系统的一部分。

Link to heading同一家族，持续扩展

随着 Geist、Geist Mono，以及现在的 Geist Pixel，这个字体家族覆盖了更广范围：从高功能性的 UI 文本，到强调表达、由系统驱动的展示场景。

我们不会止步于此。Geist Serif 已在开发中。相同的系统思维，全新的声音。

Download Geist Pixel 并开始构建。

如果没有幕后这群出色的人，这一切都不可能实现。非常感谢 Andrés Briganti，他以近乎执着的工艺与投入完成了字体设计本身；感谢 Guido Ferreyra 在整个过程中对字体打磨与调优的支持；感谢 Luis Gutierrez Rico 通过动态设计与细腻“魔法”让 Geist Pixel 真正鲜活起来；感谢 Christopher Kindl 协助我们完成落地页，并专注于那些让整体体验恰到好处的小细节；感谢 Marijana Pavlinić 持续以大胆、出人意料且极具创造力的想法推动团队；也感谢 Zahra Jabini 负责协调与技术支持，确保所有模块最终顺利拼合。这是一次真正的团队协作，我无比感激能与你们共同完成它。