Analogue aF-1

白色基底、大幅摄影展示与细线分隔。
页面以白色为基底,搭配近黑色文字。局部操作控件以蓝色强调。字体采用 ITC Garamond Std Light Narrow、Graphik Medium。视觉特点包括大幅摄影展示、细线分隔、扁平表面、衬线字形。适合参考的场景:商品详情页、品牌产品介绍页。
查看原始网站使用规范
建议采用
- 在引语、产品名称和分区开场等编辑式时刻,使用Garamond 400字重、40-64px;这是系统的标志性语气。
- #002fff只保留给任一屏幕上的唯一主要操作;绝不要用于装饰、标签或次级按钮。
- 卡片采用20px圆角,产品图像采用30px圆角;圆润柔和的几何形态与鲜明的黑白调色板形成对照。
- 分区以50px纵向间距组织,卡片内边距保持20px;紧凑密度是有意的,系统通过留白呼吸,而不是膨胀的内边距。
- Graphik Medium只使用400字重;不要引入粗体或细体变体,单一字重的一致性就是设计语言。
- 呈现模拟或怀旧图像时,以胶片条齿孔图案框住满幅摄影;边框本身就是品牌宣言。
- 任何超过30px的展示文字都采用-0.018em或更紧的letter-spacing;紧密字间距让几何形态形成建筑式密度。
建议避免
- 绝不要将#002fff用于背景、图标或文字;它只能是按钮填充色,装饰性蓝色会削弱它作为系统唯一操作色的力量。
- 不要引入投影;系统采用平面表面和细线边框,唯一允许的阴影是输入框内嵌的白色辉光。
- Garamond不要使用粗字重;轻盈字重正是要点,粗体Garamond会将编辑式低语变成高声呼喊。
- 交互元素的圆角绝不要低于10px;圆润几何是高级感不可更改的要求。
- 不要给UI组件添加渐变;渐变只作为满幅分区上的氛围色洗出现,绝不用于按钮、卡片或输入框。
- 任何状态都不要使用暖色、绿色、橘色或红色;系统由无彩色加钴蓝组成,需要成功或错误状态时使用中性色阶(#171717、#696969)。
- 功能性UI文字,如按钮、标签和输入框,不要使用Garamond;它只用于编辑式时刻,所有功能性文字都由Graphik处理。