Haus Otto 网站预览
Haus Otto 网站预览

Haus Otto

白色基底、紧密字距与宽松留白。

页面以白色为基底,搭配近黑色文字。字体采用 Monument。视觉特点包括紧密字距、宽松留白。适合参考的场景:设计工作室首页、案例展示页。

查看原始网站

使用规范

建议采用

  • 首屏文字精确设为 216px Monument Medium,字间距 -0.033em,这个尺度不可妥协,本身就是品牌。
  • 每个交互元素圆角为零,包括按钮、标签、输入框、卡片,只用尖角。
  • 默认色板只有 Obsidian #000000 与 Paper #ffffff,Terracotta #af7653 只留给单元素强调场景。
  • 基础间距设为 4px 网格,区块间距 30px;设计 Token 紧凑,留白却巨大。
  • 文字标志填满整个视口宽度,max-width 容器不得裁切展示文字。
  • 所有导航和元数据使用 13px Monument Regular,行高 1.77–2.00,为小字号留呼吸空间。
  • 白画布作为主动设计元素,绝不在文字后用颜色或影像填背景。

建议避免

  • 绝不引入第二个字体家族,Monument 是唯一声音。
  • 按钮、卡片或标签绝不使用圆角,每个转角都利落。
  • 绝不用阴影、渐变或光晕,设计平面且彩色极少。
  • 区块间绝不添加边框、分割线或细线,留白是唯一分隔。
  • 216px 展示文字绝不降到 120px 以下,文字标志的权威依赖尺度。
  • 每屏绝不超过一种强调色,Terracotta 作为标点,而非装饰。
  • 页面绝不用影像、插画或产品摄影填满,虚空上的文字就是完整视觉系统。