Guglieri 网站预览
Guglieri 网站预览

Guglieri

近黑色基底、胶囊形控件与紧密字距。

页面以近黑色为基底,搭配白色文字。字体采用 Arial、Raveo Variable Variable。视觉特点包括胶囊形控件、紧密字距、细线分隔、宽松留白。适合参考的场景:设计作品集、创意服务介绍页。

查看原始网站

使用规范

建议采用

  • 所有标题和展示文字都使用Raveo Variable 1000字重,绝不要降至700或以下;厚重感是标志性特征。
  • 64px展示文字的letter-spacing设为-0.04em,22-32px标题设为-0.02em;12px微型标签则放宽至0。
  • 保持0%色彩丰富度,每种UI颜色都必须无彩色;绝不要引入品牌色相、强调色或状态色。
  • 主要内容块之间使用116px分区间距;这种宽松让页面感觉像画廊,而非信息流。
  • 胶囊按钮的border-radius设为40-50px,使其呈现完整圆润的胶囊形,而非圆角矩形。
  • 轮播分页圆点右对齐,直接置于展示标题下方,彼此间隔10px。
  • 每个Raveo Variable实例都启用字体特性“blwf”、“cv03”、“cv04”、“cv09”和“cv11”;它们是排版身份的一部分。

建议避免

  • 绝不要引入彩色,不使用蓝色、绿色或暖色;仅允许灰阶和编辑式图像内部的色相。
  • Raveo Variable绝不要低于1000字重;更轻的字重会破坏厚重的排版语气。
  • 展示文字绝不要使用标准无衬线字体;Raveo紧缩而厚重的形态就是整个品牌。
  • 绝不要添加投影、辉光或渐变;系统刻意保持平面,深度只来自灰阶层叠。
  • 正文绝不要居中;除展示标题之外,所有内容均左对齐,不对称网格是布局语气。
  • 按钮水平内边距绝不要低于40px;胶囊形需要空间才能显得像胶囊,而非小标签。
  • 导航行中绝不要使用图标;导航项只有厚重文字,图标语言只保留给按钮和光标。