Eindhoven Design District 网站预览
Eindhoven Design District 网站预览

Eindhoven Design District

白色基底、胶囊形控件与渐变展示。

页面以白色为基底。字体采用 HelveticaNow。视觉特点包括胶囊形控件、渐变展示、大字排版、细线分隔。适合参考的场景:创意机构官网、项目作品集。

查看原始网站

使用规范

建议采用

  • 所有大于50px的显示字号文本使用 HelveticaNow 400字重——在极端尺度下采用较轻的字重是系统的标志性张力
  • 所有按钮、标签和语言选择器的圆角半径设置为500px——胶囊形状不可妥协
  • 维持黑/白/#e8e8e8三色基调的纪律——坚决不为界面元素添加强调色
  • 仅在内容区域的编辑分类标签中使用 #ff0000,绝不用于按钮、链接或结构元素
  • 150px+展示字号的字间距设为-0.05em,随字号缩小逐步放宽,到14px图注时为+0.015em。
  • 每段内容背景交替使用 #ffffff 和 #e8e8e8,以创造节奏而不增加装饰
  • 照片以矩形裁切呈现,不加边框、圆角或阴影——让图像原样呈现于页面

建议避免

  • 不要在50px以上显示标题中使用600字重——系统在大尺寸下保持低语调,不会喧宾夺主
  • 任何组件均不添加阴影、渐变或玻璃效果——系统以扁平化为信念
  • 不要引入第二套操作色——按钮始终为黑边白底或实心黑底白字
  • 除0px(矩形)或500px(胶囊)外,不使用其他圆角值——禁止使用4px、8px或16px的圆角
  • 显示文本的行高不得高于1.0——超大字号文字的紧密堆叠是视觉标识
  • 不要用边框、空白缓冲区或容器将照片与文字构成隔开——保持图文的直接对话
  • 不要将红色强调色用于交互状态、悬停效果或聚焦环——它是内容标记,而非系统令牌