Flowers For Society 网站预览
Flowers For Society 网站预览

Flowers For Society

浅色基底、大幅摄影展示与渐变展示。

页面以浅色为基底,搭配蓝色文字。字体采用 Soehne、Integral。视觉特点包括大幅摄影展示、渐变展示、大字排版。适合参考的场景:品牌电商首页、商品展示页。

查看原始网站

使用规范

建议采用

  • #203b90是唯一彩色,应出现在标志、标题、边框和首屏遮罩中,以明确品牌身份。
  • 所有操作都采用41-60px圆角的胶囊按钮,绝不用矩形或轻微圆角按钮。
  • 首屏采用满幅产品摄影,配从左到右的渐变遮罩。
  • 所有UI和正文采用Soehne和0.043-0.063em宽letter-spacing,以维持编辑式韵律。
  • 所有展示标题采用Integral和0.92-1.0紧密行高,形成压缩的杂志式排版。
  • 页面以白色为主,#f2f2f2只用于页脚横带。
  • 所有交互元素采用30px横向内边距和12-15px纵向内边距。

建议避免

  • 不要引入额外彩色;整个系统只以靛蓝和中性色表达。
  • 不要使用box-shadow或抬升效果;设计刻意保持平面。
  • 按钮或输入框不要采用矩形;41-60px极大圆角是标志性特征。
  • 标题或展示文字不要使用正文字体;Integral独自承载编辑式语气。
  • Soehne不要采用紧密letter-spacing;宽字间距赋予UI精品店感。
  • 非首屏分区不要添加装饰渐变或背景图案。
  • 不要采用多种边框色;品牌边框保持#203b90,工具性边框保持#000000。