Ghia 网站预览
Ghia 网站预览

Ghia

暖白色基底、大幅摄影展示与胶囊形控件。

页面以暖白色为基底。字体采用 Vivey 22 Positive、FHA Condensed French NC。视觉特点包括大幅摄影展示、胶囊形控件、大字排版、衬线字形。适合参考的场景:品牌电商首页、商品展示页。

查看原始网站

使用规范

建议采用

  • 标题使用 FHA Condensed、全大写和 1.0–1.15 行高,绝不采用混合大小写或宽裕行高。
  • 所有按钮、标签和产品图像框都使用 9999px 圆角。
  • Coral CTA #ef6079 填充搭配 Bone White #fef6ee 文字,字体为 14px 的 Vivey 400。
  • 满幅奶油色与勃艮第区块交替,创造编辑节奏。
  • 网格项中的产品酒瓶裁切到 9999px 圆形框内。
  • Limoncello Yellow #f0e87b 只用于促销贴纸叠层,不用于大面积表面。
  • 区块内边距保持 64–80px,卡片内边距为 24px,以留出呼吸空间。

建议避免

  • Olive Grove #3e4938 或 Rivira Blue #abd2eb,不要用于主要 CTA 填充。珊瑚色是唯一操作色。
  • FHA Condensed 不要小于 24px。紧窄字形在小字号下会失去可辨认性。
  • 交互元素不要使用锐利的 0px 或 4px 圆角。系统建立在胶囊形上。
  • 卡片或按钮不要添加投影。纵深来自颜色对比与摄影,而非悬浮效果。
  • 不要使用渐变。配色严格保持平面和地中海气质。
  • 不要在勃艮第、珊瑚、奶油系统之外引入新彩色。Rivira Blue 与 Limoncello Yellow 是强调,而不是基础。
  • 同一层级不要混用衬线与无衬线。Vivey 表示正文,FHA Condensed 表示展示,两者绝不重叠。