Squarespace

白色基底、大幅摄影展示与胶囊形控件。
页面以白色为基底,搭配近黑色文字。字体采用 Clarkson、Clarkson Serif。视觉特点包括大幅摄影展示、胶囊形控件、大字排版、紧密字距。适合参考的场景:软件产品首页、服务说明页。
查看原始网站使用规范
建议采用
- 所有展示类标题均使用 300 字重的 Clarkson,字号范围为 40–72px — 轻量级是品牌的标志性风格,而非 700 字重
- 在 72px 字号时设定字间距为 -0.06em,并按比例递减 — 严禁在大字号文本中使用默认字间距
- 页面区块交替使用全黑 #000000 与全白 #ffffff 背景 — 页面节奏由黑白对比定义,而非色彩
- 按钮使用 0px 圆角,卡片使用 8px 圆角 — 从锐利到柔和的圆角对比是刻意设计
- 所有胶囊形标签、标签和滤镜芯片的圆角均设为 100px
- 首屏区域必须由满幅摄影或视频承载 — 严禁使用纯色或渐变背景
- 在浅色区块中,将章节标题和行动号召(CTA)居中对齐;在深色特征网格中左对齐
建议避免
- 绝不要将有彩色加入配色——这个系统按设计保持 0% 色彩丰富度。
- 绝不使用 700 或 800 字重的 Clarkson — 品牌调性最高仅到 500 字重
- 绝不使用纯色首屏背景 — 首屏必须始终为摄影或视频
- 绝不将 100px 胶囊圆角应用于矩形按钮或卡片 — 胶囊形态仅限于滤镜标签和标签
- 绝不将正文文本设置在低于 14px 或高于 #898989 的白色背景上 — 对比层级必须清晰
- 绝不为卡片添加阴影 — 深度来自与画布的对比,而非立体感
- 绝不为 UI 组件添加渐变背景 — 唯一检测到的渐变仅作为装饰性存在(柔和的蓝到黄到白过渡),并非 UI 模式