Krea 网站预览
Krea 网站预览

Krea

近黑色基底、视频展示与大幅摄影展示。

页面以近黑色为基底。字体采用 Suisse Intl。视觉特点包括视频展示、大幅摄影展示、大字排版、产品图像展示。适合参考的场景:AI 工具官网、产品能力介绍页。

查看原始网站

使用规范

建议采用

  • 任何视图中的主要 CTA 均使用纯白色 (#ffffff) —— 严禁引入第二组浅色按钮
  • 将显示文本设为 48–96px 的 Suisse Intl 500,字间距 -0.025em,行高 1.0–1.11
  • 仅当需要从 Obsidian 中突出表面时,才使用 Charcoal (#171717);若卡片位于与之相近的色调上,才添加 1px Iron 边框
  • 所有按钮、标签和胶囊的圆角均设为 9999px;输入框和小型卡片为 8px;大型功能区域为 14–32px
  • 保持主要区块间 80–96px 的间距,以及同级元素间 12–20px 的间距
  • 任何眉题、区块标签或分类标签默认采用大写,字间距+0.10em、字号12px、字重500。
  • 让产品图像主导页面——用最大量的深色负空间包围 AI 生成的视觉内容,而非装饰性的金属色

建议避免

  • 严禁引入色彩强调色——系统刻意保持 0% 色彩性;加入红色、蓝色或绿色将破坏黑色画廊的调性
  • 按钮绝不使用 8px 圆角——它们仅为 9999px 的胶囊形
  • 卡片或功能区块绝不使用阴影——高度来自表面色调,而非模糊效果
  • 绝不使用斜体、下划线或彩色内联链接——链接仅通过字重或色彩变化实现(Fog → 白色)
  • 正文文本绝不低于 14px 或高于 16px,除非有明确的排版理由(标题注释降为 12px 大写)
  • 正文行高绝不高于 1.5 —— Suisse Intl 在深色背景上经过优化,以实现更紧凑的垂直节奏
  • 绝不将浅色背景(#f5f5f5、#e5e5e5)作为页面背景——它们仅用于倒置区块内的内容块,绝不可作为全页背景