Evergreen 网站预览
Evergreen 网站预览

Evergreen

暖白色基底、手绘图形与衬线字形。

页面以暖白色为基底。字体采用 ivypresto-headline、Rubik。视觉特点包括手绘图形、衬线字形、胶囊形控件、居中构图。适合参考的场景:软件产品首页、服务说明页。

查看原始网站

使用规范

建议采用

  • 所有页面与区块标题都使用 IvyPresto Headline 600,字号为 54–74px,绝不替换为无衬线。
  • 主要 CTA 以 #000000 填充,胶囊圆角为 40.5px,标签为白色 Rubik 500;任何其他颜色都不能填充按钮。
  • 页面背景使用 #edede2,卡片表面使用 #fffff3;绝不反转为白底纯白卡片或深色主题。
  • 圆形人像照片置于 #beedc0 鼠尾草薄荷光环上,而非方形框内;绿色绝不填满大型区块。
  • 首屏标题和正文在约 1200px 的最大宽度内居中,让衬线文字占据页面完整宽度。
  • 产品模型搭配手绘绿色叶片插画,叶片越过卡片边缘,延伸到周围奶油色区域。
  • 正文使用 Rubik 400、19px 和 1.9 行高。紧密行高会与疏朗编辑节奏竞争。

建议避免

  • 鼠尾草薄荷 #beedc0 不要用于按钮填充、链接颜色或大型背景。它是强调铺色,而不是操作品牌色。
  • 不要引入其他强调色、渐变或高饱和色相。配色刻意保持单色加一种植物色调。
  • 卡片、按钮或图像不要应用 box-shadow。抬升只来自奶油色叠在奶油色上的表面层次。
  • 标题不要小于 54px。衬线被设计用于编辑尺度,在正文字号下会失去存在感。
  • 按钮不要采用方角或 4px 圆角。所有交互元素都是 40.5px 胶囊,或 46px 的完全圆润标签。
  • 页面背景不要填充 #ffffff。只有 #edede2 承担温暖亚麻气质。
  • 标题不要使用无衬线或系统字体。IvyPresto 或 Playfair Display 是品牌文字身份。