Earlydog 网站预览
Earlydog 网站预览

Earlydog

暖白色基底、胶囊形控件与几何图形。

页面以暖白色为基底,搭配近黑色文字。字体采用 degular-display、usual。视觉特点包括胶囊形控件、几何图形、大字排版、分屏构图。适合参考的场景:开发者工具官网、API 服务介绍页。

查看原始网站

使用规范

建议采用

  • 所有标题均使用 degular-display 700 — 严禁替换为其他字重或字面
  • 显示标题设定为 52、80 或 116px,对应正字间距(0.009–0.019em)——字间距随字号变化而变化,而非与之对抗
  • 所有按钮和标签均使用 border-radius: 9999px — 节圆形状是系统中唯一的圆角
  • 插图基于 Bauhaus 基本元素构建:圆形、方形、三角形、棋盘、放射星形、半圆形 — 所有元素均采用锐利的 0px 角度
  • UI 配色限制为三种颜色(#fff9f0、#000609、#0a65db)——让插图承载完整的原色光谱
  • 主要区块之间保持 96px 的垂直间距,以维持宽敞、海报般的节奏
  • 正文文本设定为 18px/1.82,配合最大宽度约 480px,以保障编辑可读性

建议避免

  • 不要在插图、卡片或装饰性形状上使用圆角 — 所有几何元素均为锐利 0px 角度
  • 不要使用填充色按钮 — 所有交互元素均为边框胶囊形,带有 1px Midnight Ink 边框
  • 不要在显示标题上使用负字间距 — 正字间距正是品牌调性
  • 不要引入超过一个色彩功能色 — Signal Blue 为唯一强调色;其他原色仅存在于插图中
  • 不要使用小于 16px 的正文或行高小于 1.78 的文本 — 开放行距是温暖、宽敞氛围的一部分
  • 不要添加阴影、渐变或高光 — 系统为扁平、印刷图形风格,无深度
  • 不要使用摄影图像或写实插图 — 视觉语言严格限定于几何与抽象