Ingmar Coenen 网站预览
Ingmar Coenen 网站预览

Ingmar Coenen

白色基底、胶囊形控件与大字排版。

页面以白色为基底,搭配近黑色文字。字体采用 Megazoid、ITC Garamond Std Light Condensed。视觉特点包括胶囊形控件、大字排版、紧密字距、衬线字形。适合参考的场景:设计产品官网、作品展示页。

查看原始网站

使用规范

建议采用

  • 网站级展示标题采用295px的Megazoid,行高为0.9;它是唯一值得占据满幅空间的元素。
  • 所有UI文字均采用Neue Haas Unica Pro 12-13px,letter-spacing为-0.02em,行高为1.1。
  • 每个交互元素,包括按钮、导航胶囊和切换开关,都使用100px border-radius,以柔化单色系统的严峻感。
  • 任何超过两行、带有沉思感或编辑式语气的段落都采用ITC Garamond Light Condensed 36px。
  • 主要布局分区之间保持80-120px的纵向呼吸空间。
  • 整个调色板限定为黑、白、炭灰和浅石灰色;任何彩色都由项目图像提供。
  • 所有卡片和图像容器使用12px圆角,行内元素和细线细节使用4px圆角。

建议避免

  • 绝不要引入彩色;0%色彩丰富度是品牌结构的一部分。
  • 正文字号绝不要低于12px或高于36px;字体系统刻意采用两种尺度,即微小UI和纪念碑般的展示文字。
  • 绝不要使用box-shadow表现抬升;依靠鲜明的黑白对比和12px圆角来区分表面。
  • Garamond的介绍段落绝不要居中对齐;它被刻意锚定在右侧,这是编辑式布局的选择。
  • 正文或导航绝不要使用系统字体;Neue Haas Unica Pro紧密的字间距是标志性特征,不能当作可被后备字体替代的部分。
  • 绝不要为卡片或表面添加装饰性渐变、纹理或背景图案。
  • Neue Haas Unica Pro的行高绝不要超过1.2;紧密的1.1行高是瑞士式目录气质的一部分。