Exante 网站预览
Exante 网站预览

Exante

白色基底、紧密字距与非对称构图。

页面以白色为基底,搭配近黑色文字。字体采用 Alliance No.2、Geist。视觉特点包括紧密字距、非对称构图、网格布局、摄影展示。适合参考的场景:支付服务首页、金融科技产品介绍页。

查看原始网站

使用规范

建议采用

  • 所有 28px 及以上的展示文字和标题都使用 Alliance No.2;根据字号,设置 -0.01em 至 -0.05em 的负字间距。
  • 每个区块的引导标签都使用 12px 的 Geist Mono、全大写和 +0.06em 字间距。这是系统标志性的编辑式标点。
  • 所有按钮、卡片、输入框和标签都使用 2px 圆角。8px 只留给图像。
  • Neon Mint #90fc95 用作铺满宽度的区块背景或大面积表面,不用作按钮填充或小元素的文字颜色。
  • 实心按钮和主要文字使用 Obsidian #1e211e。它微弱的绿色底调,让深色表面与品牌强调色重新建立联系。
  • 每个营销页面至少放置一个满幅深色 Obsidian 区块,以及一个满幅 Neon Mint 区块。这种双重情绪的节奏就是品牌。
  • 标题行高压缩至 1.00–1.10,正文行高设为 1.40–1.50。紧密展示文字与舒适正文的对比是标志性特征。

建议避免

  • 不要使用柔软或较大的圆角。2px 是系统限制,任何超过 8px 的值都会破坏建筑式语言。
  • Neon Mint 不要用作按钮背景、链接颜色或文字强调。它是表面色,而不是点缀色。
  • 不要用投影或模糊制造悬浮效果。系统只通过颜色对比叠放表面。
  • 正文不要小于 14px 或大于 24px。Geist 的舒适范围狭窄且有意限定。
  • 纯黑 #000000 不要用于大面积填充或文字区块,只留给边框和 1px 细节;表面由 Obsidian 承担。
  • 每页不要使用超过一种彩色。整个配色只有一种强调色。
  • Alliance No.2 可用时,不要用 Geist 设置标题。定制展示字体与界面字体之间的对比,是文字的标志性特征。