Basedash 网站预览
Basedash 网站预览

Basedash

深夜数据终端,文字带有磨砂质感。一个黑暗的观测站,各项指标以紫罗兰色和绿色发光,衬线标题漂浮于噪音之上,而白色胶囊形按钮是整个房间中唯一明亮的元素,其余表面均为柔和的黑色。

Basedash 为数据工作呈现暗色模式操作界面:纯黑色画布,近黑色提升的卡片,以及白色文字,读起来如同终端界面。品牌调性沉稳且技术化——Inter 承担所有功能性排版,字间距极紧,而定制的衬线字体(Alpha Lyrae)在 48px 字号下承载首屏标题,为单调的黑白界面增添一份安静的编辑感。两个色彩元素——鲜明的紫罗兰色和鲜明的绿色——仅在图表和强调填充中出现,从不作为装饰使用。按钮颠覆了常规暗色模式预期:填充操作为白色胶囊形按钮置于黑色背景,轮廓操作为透明描边链接,使主要操作按钮发光。布局居中且宽松,卡片以 16px 半径悬浮于虚无之中,按钮控制在 6px,这种差异传达出‘卡片是容器,按钮是工具’的含义。

查看原始网站

使用规范

建议采用

  • 使用 #ffffff 作为黑色画布上填充按钮的背景色——这种反色是系统的标志性操作风格
  • 所有标题设置为 48px 字号,使用 Alpha Lyrae 字体 400 字重,行高 1.0——不得缩放或改变显示衬线字体的字重
  • 所有 Inter 字体文本,无论字号大小,均应用 -0.03em 字间距——紧致的字间距是系统调性的组成部分
  • 按钮使用 6px 半径,卡片使用 16px 半径——不得交换或插值这些数值
  • 将紫罗兰色(#9984d8)和 薄荷绿 色(#3fcb7f)保留用于数据/图表场景和实时状态——不得将其用于文本或背景作为装饰
  • 所有首屏和区块标题居中对齐——布局节奏对称,而非不对称
  • 集成品牌标识以原生品牌色彩在黑色背景上呈现——多色网格是刻意的视觉证明,体现广度

建议避免

  • 不得将紫罗兰色或 薄荷绿 色用作按钮填充——主要操作始终为白色背景上的黑色
  • 不得为卡片添加阴影——暗色表面系统依赖于近似值且不使用阴影语言
  • 不得打破 6px/16px 半径规则,通过将按钮半径四舍五入匹配卡片或反之操作
  • 不得使用 Inter 作为展示性标题——仅保留 Alpha Lyrae 48px 用于 h1/h2 首屏品牌展示场景
  • 不得使用全白(#ffffff)作为正文——次要文本使用灰银色(#b3b3b3)以建立层级关系
  • 不得在黑色画布上放置具有硬边的亮色卡片——使用 #050607 保持表面语言的内敛性
  • 不得使用暖灰色——所有中性色倾向冷调,与紫罗兰色强调的温度保持一致