AVNIER 网站预览
AVNIER 网站预览

AVNIER

白色基底、产品图像展示与大字排版。

页面以白色为基底。字体采用 Space Mono、avnier-font。视觉特点包括产品图像展示、大字排版、大幅图像展示、摄影展示。适合参考的场景:品牌电商首页、商品展示页。

查看原始网站

使用规范

建议采用

  • 使用 #ffffff 作为默认画布,全黑首屏、商品信息和页脚区域使用 #000000。
  • 将导航、标签、页脚链接、产品描述和输入控件设置为 Space Mono 12px-15px。
  • 将主要类别标签设置为 avnier-font 55px/64.9px 字重 500,文字颜色为 #000000,背景为 #ffffff。
  • 使用 1px 实线 #000000 或 #ffffff 代替卡片阴影来分隔行、字段和页脚区域。
  • 保持卡片、图像框、按钮和输入控件的圆角为 0px。
  • 使用 50px 的区块间距,30px 的卡片内边距(当内容需要内嵌时),以及 10px 的紧凑控件元素间间距。
  • 保持产品摄影为暗色且近单色;任何服装颜色都应被限制在图像内部。

建议避免

  • 不要引入饱和的界面强调色、渐变、彩色状态胶囊或染色按钮填充。
  • 不要对商品控件进行超出圆形浮起关闭控件的圆角处理。
  • 不要使用柔和的投影阴影;使用 1px 实线和 #ffffff 与 #000000 之间的平面切换。
  • 不要在 avnier-font 可用时将大标题设置为 Space Mono。
  • 导航、工具文本、类别标签和产品元数据均不要使用小写或句子式大小写。
  • 不要将每个链接都变为填充按钮;保留透明文字与箭头的发现链接,分别在 #000000 和 #ffffff 背景上。
  • 不要将明亮、高反差的生活方式摄影置于黑色设备间视觉风格的旁边。