Base 网站预览
Base 网站预览

Base

白色基底、等宽文字标注与圆角卡片。

页面以白色为基底,搭配近黑色文字。局部操作控件以蓝色强调。字体采用 Doto、Coinbase Sans。视觉特点包括等宽文字标注、圆角卡片、大字排版、宽松留白。适合参考的场景:技术项目官网、区块链产品介绍页。

查看原始网站

使用规范

建议采用

  • 首屏标题使用80px、110px或115px,字间距收紧至-0.025em至-0.05em——极端的尺寸与紧密的字间距是该系统的标志性特征。
  • 所有类别标签、区块标签和元数据均使用 Coinbase Mono 12px,字间距0.073em,大写呈现。
  • 仅在三个场景中使用 #0000ff:标志区块、主要填充按钮和地图数据点。切勿用于正文、图标或装饰。
  • 保持以4px为基准的间距网格:4、8、12、16、24、32、48px 用于间距和内边距。
  • 所有卡片、按钮和面板的圆角均设为8px——确保表面系统的统一性。
  • 每个区块配一个位于内容块上方16px处的 Coinbase Mono 类别标签。
  • 所有区块的背景色统一为 #ffffff;仅在提升状态的面板和透明描边按钮中使用 #f2f2f2。

建议避免

  • 除标志、主要操作按钮或地图数据点外,切勿使用 #0000ff——过度使用会破坏有限强调系统的平衡。
  • 不要使用阴影或投影来实现层级感——结构来自间距和边框,而非阴影。
  • 正文文本大小不得低于14px或高于18px——字体层级从18px跃升至32px。
  • 不要使用渐变、照片背景或3D渲染——该系统为扁平且示意性的。
  • 除8px(卡片/按钮/面板)或2px(小标签)外,切勿使用其他圆角值——不同圆角会破坏表面系统的连贯性。
  • 不要破坏侧边栏与流式内容布局——固定左侧栏是结构性的,非可选。
  • 不要通过颜色传递信息层级——应使用字体粗细、尺寸以及 Slate/Carbon 对比度来实现。