Geniestudio 网站预览
Geniestudio 网站预览

Geniestudio

柔软的日光笔记本——那种有充足页边距和单根粗笔触的笔记本

Genie 采用轻盈、日光工作室风格的语言:以浅天蓝色画布(#ebf5ff)为背景,界面几乎为单色,仅由近黑色按钮提供视觉上的密度。显示文本尺寸巨大——在 Aeonik 字体中可达 148px——字重固定为 500,感觉像是镌刻而非喧哗,字间距收紧至 -0.02em,使标题读来充满自信,而非装饰性字体。圆润的形状占主导:32px 卡片、9999px 胶囊控件,以及柔和的淡彩渲染(薰衣草、薄荷、桃粉、天空色)成为色彩唯一出现的区域,除了一种鲜明的蓝色强调色外,其他均以深灰黑色的 CTA 填充为点缀。充满童趣的 3D 渲染插图——云朵、蜡笔、微笑物体、漂浮信封——漂浮在空白区域,传递品牌个性;界面本身保持克制,近乎建筑感的严谨。

查看原始网站

使用规范

建议采用

  • 所有显示和标题文本使用字重 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,也不将显示尺寸用于正文内容——该尺寸有明确下限,用于编辑场景