Foundry 网站预览
Foundry 网站预览

Foundry

近黑色基底、等宽文字标注与大字排版。

页面以近黑色为基底。字体采用 JetBrains Mono、Inter。视觉特点包括等宽文字标注、大字排版、细线分隔。适合参考的场景:设计作品集、创意服务介绍页。

查看原始网站

使用规范

建议采用

  • 所有 UI 组件(导航、标签、元数据、按钮、区块标题)均使用 JetBrains Mono 400,它是操作系统的默认字体。
  • 侧边栏项目和按钮文字使用大写,字间距为 0.04em;仅在正文内容中保留紧缩字间距(-0.02em)。
  • 仅将橙色 #ff4d00 用作 1px 细线边框或文字强调——绝不作为填充背景。带橙边的「立即购买」按钮是其标准用法。
  • 保持所有角落锐利:导航、标签和按钮为 2.8px,仅在较大卡片容器中为 8px。绝不出现圆角。
  • 通过色彩反转(浅灰白面板置于近黑色画布上)和细线边框(#e2e8f0)构建深度——绝不使用阴影。
  • 让每种展示字体完整占据其区块的全宽(90–234px);将展示区域视为展览,而非受限内容卡片。
  • 每个操作按钮都应配一个透明描边的伴生控件(例如,橙边「购买下一组」旁配透明白「探索」)位于同一行。

建议避免

  • 按钮或表面绝不填充 #ff4d00——它仅作为笔触和文字强调。
  • 绝不引入新的强调色;色彩调性为单色中性色加唯一一个色彩主调。
  • 绝不为任何组件添加阴影或厚重的堆叠效果;系统设计为平面化。
  • 绝不将正文或元数据使用展示字体——这些是展示内容,而非 UI 字体。
  • 绝不使用大于 8px 的圆角;2.8px 的标签圆角是标志性特征,任何更大的圆角都会破坏蓝图感。
  • 绝不使用 Inter 作为标签、按钮或元数据——仅保留用于段落长度的辅助说明文本。
  • 页面布局绝不居中:侧边栏固定在左侧,内容在列内左对齐,画布向右延伸。