Klim
近黑色基底、满幅色块与大幅摄影展示。
Sociotype
浅色基底、大幅摄影展示与大字排版。
页面以浅色为基底，搭配近黑色文字。字体采用 Main Onsite、Onsite。视觉特点包括大幅摄影展示、大字排版、细线分隔、分屏构图。适合参考的场景：设计产品官网、作品展示页。
查看原始网站使用规范
建议采用
- 所有组件（按钮、卡片、输入框、标签和图片）的圆角均设为 0px —— 角度的锐利是字体制造商美学的一部分。
- 所有 UI 文字使用 Onsite 400 字重，绝不使用粗体。该网站以平稳沉静的语气表达；若使用 700 字重，就会喧宾夺主，淹没字形样本。
- 对于小于 16px 的 UI 文字，字间距设置在 0.025em 至 0.080em 之间，以赋予小标签博物馆卡片般的质感；仅在 251px 显示样本中保留 0.001em 字间距。
- 所有表面保持纯白（Paper，#ffffff）背景，搭配 Onyx（#000000）文字。不使用任何色调，不启用深色模式，不使用卡片填充——背景始终是相同的白色，用以承载字形样本。
- 所有分隔线和结构边框使用 1px 实线 #d6d6d6 或 #9d9d9d。禁止使用 2px 以上线段、阴影或双线。
- 文字链接末尾的箭头（→）取代按钮样式。“更多信息 →”是标准的链接模式，不要使用带边框方框中的“阅读更多”。
- 每款展示字体使用一张单一的氛围感照片作为页面中唯一的色彩来源。首屏图像正是配色获得饱和度的时刻。
建议避免
- 不要在 UI 中引入任何色彩。0% 的色度是明确的信号，表明字体是核心产品——加入蓝色、红色或任何强调色都会与字形样本产生竞争。
- 不要使用阴影、渐变或任何立体效果。设计语言为扁平化；深度来自字形层级和留白，而非 z 轴技巧。
- 不要在标题中使用粗体（600/700）。保持 Onsite 400 字重；仅通过字号体现层级（14 → 18 → 26 → 40 → 251）。
- 不要对任何角落进行圆角处理。4px 或 8px 的圆角会使字体制造商看起来像普通 SaaS 卡片——锐利的 0px 圆角才使其具有编辑印刷的质感。
- 不要为卡片或导航项填充背景。让 Paper 背景自然透出；若组件需要与页面分离，使用 1px #d6d6d6 边框替代填充。
- 不要使用仅含图标且背景彩色的按钮。控件仅使用 #818181 的纯文字，或使用 12px 的空心图标——尺寸选择器和全屏切换按钮展示了该模式。
- 正文不要低于14px。最小UI字号为11–12px，仅用于图注和元信息标签，绝不用于长篇阅读。
