Adanola 网站预览
Adanola 网站预览

Adanola

白色基底、宽松留白与摄影展示。

页面以白色为基底,搭配近黑色文字。字体采用 Favorit、Nunito Sans。视觉特点包括宽松留白、摄影展示、居中构图、网格布局。适合参考的场景:商品详情页、品牌产品介绍页。

查看原始网站

使用规范

建议采用

  • 所有界面触点使用 Favorit,包括导航、按钮、产品名、标题,字间距 0.025em 是定义品牌的排版指纹。
  • 主要操作设为幽灵或轮廓按钮:1px #000000 边框、透明填充;黑填充留给快速添加等紧凑次要操作。
  • 产品卡片、图片和标签圆角都为 0px,4px 只用于按钮与输入框,利落矩形是编辑造型册感的核心。
  • 列表与编辑页面让产品摄影提供全部色彩,界面外框保持近单色:白表面、黑字、#e5e7eb 交替,让服装色相成为唯一彩色强调。
  • 界面元素使用紧凑 4px 基础间距 4/8/16/24px,再跳到充足的 64px+ 区块间距,形成产品网格之间平静编辑节奏。
  • 产品卡片布局锚定桌面 4 列网格,图片边到边填满卡片宽度,无卡片容器、阴影或产品图边框。
  • 黑公告栏作为导航上方常驻条带,用 #000000 背景和白色 9px Favorit 文字,提供推广与配送消息。

建议避免

  • 任何组件不要引入投影或 box-shadow 浮起,系统刻意平面,以留白与细线分隔。
  • 按钮、链接或交互状态不要用饱和品牌色,操作色板严格黑、白、轮廓。
  • 产品卡片图片或容器不要圆角,利落矩形边缘是造型册处理的标志。
  • 标题不要用展示衬线、手写或装饰字体,低声常规 Favorit 30px 是首屏声音。
  • 页面区块不要添加渐变背景、彩色条带或装饰图案,交替最多只是细微的 #e5e7eb、#f0efe7、#f5ebd5。
  • 界面元素周围不要添加图标容器、徽章或胶囊形,标签应是纯文字,可选细下划线。
  • 任何元素不要使用 8px+ 大圆角,整个系统只锚定 0px 与 4px。