Basis Theory 网站预览
Basis Theory 网站预览

Basis Theory

白色基底、大字排版与紧密字距。

页面以白色为基底,搭配近黑色文字。局部操作控件以青绿色强调。字体采用 Neo Grotesk Medium、Neo Grotesk Bold。视觉特点包括大字排版、紧密字距、分屏构图、非对称构图。适合参考的场景:支付服务首页、金融科技产品介绍页。

查看原始网站

使用规范

建议采用

  • 使用 #ffffff 作为默认画布,所有大尺寸浅色主题标题使用 #18181b。
  • 首屏展示文字使用 Neo Grotesk Medium 80px/64px,字重 400,字间距 -3.2px。
  • 主要区块展示文字使用 Neo Grotesk Medium 56px/56px,字间距 -2.24px。
  • 仅在填充转化控件、选定标记和小范围实时路线高亮处使用 #94faf0。
  • 视觉卡片和大尺寸电青色或半透明按钮使用 16px 圆角。
  • 紧凑的 #27272a 和 #bff660 页眉或工具按钮使用 12px 圆角,内边距 8px 16px。
  • 通过 4px、8px、16px、24px 和 32px 的间距构建小型界面节奏。

建议避免

  • 不要将 #94faf0 用作页面背景或大面积区块填充。
  • 不要将卡片圆角超出 16px,也不要将所有控件变为 1000px 的胶囊形按钮。
  • 不要将 #bff660 用于销售转化控件;仅用于文档和开发路线。
  • 不要在展示标题中使用 Inter;保留 Neo Grotesk Medium 用于 32px、56px 和 80px 的展示尺寸。
  • 不要放松展示文字的字间距,保持 Neo Grotesk 标题的字间距在 -0.96px 到 -3.2px 之间。
  • 不要用粗重边框替代细腻的 #d4d4d8 构造线。
  • 不要在正文、导航或大面积卡片表面添加饱和色。