Attio
白色基底、紧密字距与细线分隔。
Slingshot
白色基底、渐变图像与细线分隔。
页面以白色为基底，搭配近黑色文字。局部操作控件以蓝色强调。字体采用 Gopher Medium、Inter。视觉特点包括渐变图像、细线分隔、摄影展示、衬线字形。适合参考的场景：SaaS 产品官网、功能介绍页。
查看原始网站使用规范
建议采用
- 首屏区域标题使用Gopher Medium，规格为56px/1.0；多行文案紧密叠放，不增加额外行高。
- #1a5fff仅用于实心CTA、公告栏和满幅功能分区；不要将其作为白色背景上的文字颜色。
- 所有卡片、图像块和产品视觉均采用12px border-radius；24px留给首屏区域尺度的面板，6px留给按钮。
- 采用眉题模式：在Gopher副标题上方放置Inter 12px、字重600、字间距0.083em的标签，用于标识分区。
- 正文保持Inter 16px、字重400和#000000；系统采用21:1阅读对比度，不要将文字柔化为比#4a4a4a更浅的灰色。
- 在不同分区使用#ecf2ff、#fff4ec和#edf9f5交替表面层级，形成编辑式横向区域的变化，而不引入新色相。
- 行内强调使用Inter字重700；它与Gopher字重400标题形成轻字重与粗字重的对比，这是系统的标志性节奏。
建议避免
- 不要引入额外品牌色；系统由单色加唯一钴蓝组成，任何第二种饱和色相都会破坏编辑式纪律。
- 不要给Gopher标题设置宽松行高；1.0的紧密行高是标志性特征，而非缺陷。
- 白色背景上的正文文字链接不要使用钴蓝；采用带下划线的#000000文字，或以Ghost Outline按钮呈现操作。
- 不要给卡片或产品图块添加阴影；系统通过细线边框和表面着色分隔内容，而非通过抬升。
- 按钮圆角不要与卡片一致设为12px；6px按钮圆角比容器更锐利，形成刻意的视觉层级。
- 不要添加渐变；系统刻意保持平面，最接近色彩深度的处理是满幅钴蓝区域。
- 标题不要使用Inter；Gopher承担展示语气，它与Inter正文的对比使字体系统具有辨识度。
