Katherine Pihl 网站预览
Katherine Pihl 网站预览

Katherine Pihl

浅灰色基底、网格布局与渐变展示。

页面以浅灰色为基底,搭配近黑色文字。字体采用 Neue Montreal、Ryhmes。视觉特点包括网格布局、渐变展示、大字排版、衬线字形。适合参考的场景:创意机构官网、项目作品集。

查看原始网站

使用规范

建议采用

  • 仅使用三色调:#000000 用于墨色,#b3b3b3 用于纸张,#999999 用于中性标签。UI 中任何位置均不可出现色彩。
  • 所有图片的圆角均设为 0px。锐利的边角是画廊墙面语言的一部分。
  • 所有结构文本(导航、标签、正文)均使用 Neue Montreal,仅将 Ryhmes 保留用于叠加在影像上的展示标题。
  • 网格行间距为 40px,列间距为 24px。空白空间即是设计系统本身。
  • 通过字重(500 对 400)表达激活状态,而非颜色或背景。'所有'为粗体;其余为常规。
  • 大写导航文字的字间距打开至约 0.07em;展示衬线字体收紧至 -0.03em。两种排版风格的温度必须一目了然。
  • 所有色彩都应置于项目影像中。由照片和实色块承载视觉重量;金属质感保持静默。

建议避免

  • 不得引入任何强调色、渐变或品牌色调——即使是最简单的 CTA 蓝色。该系统在设计上本无任何色彩强调。
  • 不得为项目影像添加背景、边框或阴影。白色墙面是唯一的表面。
  • 不得在导航、标签、正文或任何非展示文本中使用 Ryhmes。它仅用于叠加在影像上的衬线字体时刻。
  • 不得对图片、按钮或容器进行圆角处理。所有边角均为 0px。
  • 不得使用图标、按钮或汉堡菜单进行导航。两个文本链接是整个导航系统。
  • 项目标签不得居中对齐。名称与类别堆叠应左对齐,置于图像下方。
  • 不得对图片添加悬停变换、缩放或色彩变化。最轻微的不透明度变化是最大交互反馈。