Sandclock 网站预览
Sandclock 网站预览

Sandclock

近黑色基底、细线分隔与分屏构图。

页面以近黑色为基底,搭配白色文字。局部操作控件以绿色强调。字体采用 Aeonik、Inter。视觉特点包括细线分隔、分屏构图、网格布局、大字排版。适合参考的场景:技术项目官网、区块链产品介绍页。

查看原始网站

使用规范

建议采用

  • Signal Mint #3fe280 只用于主要 CTA、激活导航指示,以及实时数据统计卡片的边框。其他所有表面保持无彩色。
  • 所有 Inter 文字都设置 0.05em 字间距。这种技术感字间距,使它区别于普通 SaaS 正文。
  • 所有卡片使用 12px 圆角,所有按钮使用 16px。不要混入 8px 或 4px;12/16 的分工是几何形态的标志。
  • 72px、字重 400 的 Aeonik 只用于首屏级展示文字。绝不用它设置副标题或正文,它只留给每页唯一的宣言展示。
  • 默认采用 #0a0a0a 画布、#171717 卡片和 #222222 细线边框。通过颜色变化而非阴影表达层次纵深。
  • 区块间距采用宽裕的 48-64px。密度应读起来舒适,而非紧凑;金融产品需要呼吸空间。
  • 连接钱包操作放在右上角,采用 9999px 圆角的白色胶囊。这是导航中唯一允许反转配色的界面元素。

建议避免

  • Signal Mint 不要用于正文、图标或装饰形状。绿色是信号,而不是主题色。
  • 卡片、模态框或面板不要引入投影。平面表面是有意采用的金融信任惯例。
  • 不要使用渐变。系统刻意保持平面感,渐变会破坏终端审美。
  • Inter 字间距不要设为 normal 或负值。0.05em 的正字间距是标志性选择。
  • Ash #9b9b9b 不要用于比短辅助标签更长的文字,只将它留给弱化文字。
  • 容器圆角不要小于 12px,按钮圆角不要小于 16px。系统对几何形态具有明确要求。
  • Aeonik 字重不要超过 400。展示字体采用 400 有效,是因为 72px 字号本身承担视觉分量;加粗会过于喧闹。