General Intelligence Company 网站预览
General Intelligence Company 网站预览

General Intelligence Company

文学期刊旁的篝火

General Intelligence Company 采用一种编辑性的、近乎文学性的视觉语言:温暖的米白底色被手工绘制的氛围插图(月光下的天际线、野花草地)所打断,这些插图承担了情感表达,而实际的UI则存在于这些场景之间的纯净白色空间中。字体承载品牌调性——定制的展示衬线字体(ppmondwest)以低沉、克制的语调呈现,字号为48–54px,字间距为-0.04em,而定制的无衬线字体(af)则负责所有实用内容,字号为13–18px。色彩几乎缺席:仅使用温暖的羊皮白、柔和的灰绿边框,以及唯一一个鲜明的蓝色(#41a1cf),仅作为轮廓式操作边框使用。组件设计低调——4px与8px圆角,1px细线边框,导航栏使用轻微的背景模糊,无装饰性阴影。

查看原始网站

使用规范

建议采用

  • 任何字号27px及以上标题使用ppmondwest;绝不将无衬线字体用于展示文本
  • 所有ppmondwest标题设置为400字重,绝不用600或700——衬线字体本身具有表达力
  • 所有卡片和区块边框使用1px实线#dee2de;这种带有绿色调的细线是视觉标识
  • 按钮使用8px圆角,卡片使用12–16px圆角——同一表面避免混合使用4px与24px
  • 在行动按钮(CTA)上仅使用#41a1cf作为边框强调色;系统中不存在填充色的按钮
  • 让底色为#fefffc(温暖的米白),而非纯白#ffffff,以维持书籍页面的氛围感
  • 展示标题搭配行高1.1;正文文本搭配行高1.5——这种对比是刻意设计的

建议避免

  • 绝不使用#000000作为文本颜色——应使用#171717(墨黑)或#2c2c2c(灰黑色)以获得更柔和的暖感
  • 按钮绝不使用box-shadow;系统使用边框和背景模糊替代层级感
  • 绝不引入新的强调色——配色方案刻意保持95%中性,仅有一个蓝色
  • 绝不使用ppmondwest 600以上的字重;衬线字体的个性体现在其纤细笔画中
  • 绝不使用rgba或透明度于正文文本——所有文本颜色应为纯色十六进制值
  • 绝不使用超过24px的圆角值,除非是导航胶囊按钮;这并非一个柔和圆润的设计
  • 绝不使用#41a1cf或#0081c0填充按钮;信号蓝与天蓝仅作为边框或表面色使用