Geniestudio 网站预览
Geniestudio 网站预览

Geniestudio

白色基底、网格布局与单栏阅读排版。

页面以白色为基底。字体采用 Aeonik、Geist。视觉特点包括网格布局、单栏阅读排版。适合参考的场景:AI 服务首页、产品演示介绍页。

查看原始网站

使用规范

建议采用

  • 所有显示和标题文本使用字重 500(而非 600 或 700)——系统刻意采用中等字重,从不使用粗体
  • 所有内容卡片设置 32px 圆角,所有交互胶囊控件和标签设置 9999px 圆角
  • 将页面画布设为 #ebf5ff,卡片表面设为 #fafdff——从浅蓝色到骨白的渐变是主要的深度机制
  • 所有填充按钮使用深色填充 #181d27;仅将 #0069e0 用于强调边框和行内高亮文本
  • 标题字间距收紧至 -0.02em,正文字间距收紧至 -0.01em;绝不使用默认或正向字间距
  • 让 3D 插图在画布中漂浮,不加卡片、边框或背景——它们是品牌声音,而非装饰
  • 仅将虹彩渐变(71,157,255 → 0,105,224)用于极细的 3px 强调边框;绝不作为按钮填充或大面积表面使用

建议避免

  • 不使用粗体字重(600 及以上)于显示标题——Aeonik 500 是上限
  • 不使用 90° 的锐角于卡片或按钮——最小 16px,标准值 32px,胶囊控件为 9999px
  • 不将饱和蓝色(#0069e0)用作按钮填充——它是轮廓/强调色,而非 CTA 颜色
  • 不为内容卡片添加阴影——深度来自画布/表面颜色的渐变,而非堆叠效果
  • 不使用正文黑(#000000)作为文本——使用 #0a0d12,其带有微妙的蓝色调,与画布相呼应
  • 同一区块内不使用超过两种淡彩渲染——淡彩调色板用于板块多样性,而非视觉杂乱
  • 不将显示文本尺寸设低于 48px,也不将显示尺寸用于正文内容——该尺寸有明确下限,用于编辑场景