Alt–Border 网站预览
Alt–Border 网站预览

Alt–Border

白色基底、网格布局与大字排版。

页面以白色为基底,搭配近黑色文字。字体采用 Neuehaasdisplay、Inferi。视觉特点包括网格布局、大字排版、细线分隔、摄影展示。适合参考的场景:创意机构官网、项目作品集。

查看原始网站

使用规范

建议采用

  • 展示标题使用 Neuehaasdisplay 300,字号 105px、行高 0.85;压缩的垂直节奏是标志,而不是默认值。
  • 所有主要文字、边框与分割线使用 #000000;#808080 只用于柔和分割线。
  • 所有圆角保持 0px;设计拒绝圆润,呈现印刷而非产品界面的感觉。
  • 区块之间只用一条 1px #808080 细线和 7-9px 垂直内边距分隔,绝不通过背景色变化或卡片分隔。
  • 让照片承载所有色彩与纹理,文字和界面外框严格保持无彩色。
  • 正文与辅助文字设为 21px,字间距 -0.0270em;Inferi 与 Suisseintl 两个字体家族都一致使用负字间距。
  • 在首屏文字中内联小方形缩略图,像基线上的字符。

建议避免

  • 不要引入任何彩色;无彩色色板是有意设计,并非遗漏。
  • 不要添加投影、模糊或任何浮起效果;分隔只来自细线与留白。
  • 图片、按钮或卡片不要做圆角;0px 圆角就是系统。
  • 不要使用行动按钮样式;系统没有主要操作色,导航只有带箭头链接的文字。
  • 105px 展示文字的行高不要超过 0.92;更疏松的字间距会破坏大报式压缩感。
  • 正文字号不要低于 14px 或高于 34px;14、21、34、105 的尺度跳跃是刻意的。
  • 区块、卡片或导航不要添加背景填充;页面就是一张白纸。