Break Maiden
近黑色基底、产品图像展示与网格布局。
Dylanbrouwer
近白色基底、等宽文字标注与大字排版。
页面以近白色为基底，搭配深灰色文字。字体采用 Die Grotesk B、ABC Gravity Variable。视觉特点包括等宽文字标注、大字排版、网格布局、胶囊形控件。适合参考的场景：创意机构官网、项目作品集。
查看原始网站使用规范
建议采用
- 所有正文和中等尺寸标题使用 Die Grotesk B 500 字重——统一的字重是其标志，绝不切换为 400 或 700 变体
- 仅将 ABC Gravity Variable 用于显示级（96px 及以上）的纪念碑式标题和区块开启语——绝不用于小于 23px 的场景
- 仅在显示级 ABC Gravity Variable 字体文本上应用从黑到亮的渐变填充，绝不用于正文或小标题
- 仅将 Ember Orange（#ff6436）作为小型功能元素使用：状态点、强调填充、活跃指示器——绝不作为背景晕染、按钮填充或大面积表面
- 所有交互元素（导航按钮、标签）的边框半径必须为 9999px，所有卡片和面板为 0px——锐利的角落定义了编辑风格
- IBM Plex Mono 字体始终使用大写——它作为系统/数据层运作，大小写表明其角色
- 所有 36px 及以上 Die Grotesk B 标题保持 -0.03em 的字间距——紧凑的字间距是其压缩感和自信感的来源
建议避免
- 不要使用多种色彩——系统为单色，仅橙色为点缀色；引入额外色彩会破坏设计纪律
- 不要为卡片添加阴影或抬升效果——系统采用平面表面搭配细线边框，不使用深度
- 不要为卡片或内容面板添加圆角——角落保持锐利；胶囊形圆角仅用于交互元素
- 不要在 Die Grotesk B 中混合不同字重——所有尺寸和场景均保持 500 字重
- 不要将 ABC Gravity Variable 用于正文或小字号文本——它仅为显示字体；在小于 23px 时使用会破坏其纪念碑特性
- 不要对正文段落或中等尺寸标题进行居中对齐——一律左对齐，保持紧凑行距；居中仅用于显示陈述
- 不要使用弹跳或弹簧缓动——运动采用自定义 cubic-bezier 曲线（0.32, 0.72, 0, 1）和（0.19, 1, 0.22, 1），实现沉重、有目的的移动效果
