Epidemicsound 网站预览
Epidemicsound 网站预览

Epidemicsound

白色基底、宽松留白与满幅色块。

页面以白色为基底。字体采用 Inter、sebentaFont (custom editorial serif)。视觉特点包括宽松留白、满幅色块、扁平表面、衬线字形。适合参考的场景:音视频产品介绍页、媒体内容展示页。

查看原始网站

使用规范

建议采用

  • 展示标题采用sebentaFont 500、64–80px、1.0–1.06行高和-0.04em letter-spacing;衬线承担表现,不要配第二款展示字体。
  • 标题内部的强调使用衬线自身的斜体款式,例如“the sound”和“a faster way”;绝不要为强调改用不同颜色或字重。
  • #000000填充按钮是唯一填充样式,次级操作配#f1f0eb无填充按钮;没有圆角,除NEW徽章外所有地方均为0px。
  • Hot Pink(#ff82c2)作为满幅分区背景,而非小强调;它宣告页面章节,不装饰按钮。
  • 正文采用Inter 16px、1.56行高和0 letter-spacing;0.1em字间距只用于10–14px说明或标签字号,以及全大写语境。
  • 空间节奏维持64px分区间距和24px卡片内边距;设计宽松且具有编辑感,不要压缩。
  • 页面保持1%色彩丰富度,画布大部分为白色与骨白;每个彩色分区都是有意的停顿,而非装饰。

建议避免

  • 不要使用第二款展示衬线或手写字体;定制sebentaFont及其斜体,是展示字号唯一的语气。
  • 按钮、卡片或折叠面板行不要使用圆角;0px圆角是编辑式感受的结构部分,圆角会破坏杂志逻辑。
  • 强调词不要重新着色;展示衬线的斜体就是强调系统,在黑色标题内加入Hot Pink词语会破坏节奏。
  • 白色背景上的文字不要采用#ff82c2、#20afff或#ffda40;它们是分区背景色,在正文尺度下对比度不合格,并像玩具配色。
  • 卡片不要添加投影或抬升;系统平面,表面层级通过white → bone → mist背景色变化传达,而非阴影。
  • 不要引入绿色成功、红色错误的语义配对;粉、蓝、黄、橘、绿彩色调色板用于装饰和编辑表达,而非状态系统。
  • 不要连续堆叠彩色分区;一个彩色块与一个单色块交替,粉到蓝的节奏成立是因为它很少出现。