01
设计气质 DNA
性能技术户外高端极简
技术性登山探险装备融合高阶时装极简主义
02
色彩
#1A1A1AInk#FFFFFFBG#666666Mutedrgba(26, 26, 26, 0.15)Line单色基底,摄影图片承载全部色彩
03
字体
- display
56px · 700 - heading
28px · 700 - body
16px · 400
导航与主要CTA使用全大写 · 正文统一0.32px字间距 · 标题与正文字重形成高对比度层级
04
间距
4px8px16px24px32px48px64px96px基于8px节奏系统,留白充裕
05
表面 (圆角 / 阴影 / 边线)
sm · 2px
md · 4px
lg · 8px
pill · 999px
交互元素使用1px实线边框
rgba(0, 0, 0, 0.2) 0px 0px 18px 0px
06
布局
1440container
12columns
24pxgutter
768 / 1024breakpoints
全出血英雄区摄影图搭配居中文本叠加层,衔接多栏产品网格
07
动效与交互
200msmicro
300mssmall
500msmedium
ease-in-outeasing
下划线hover动画 · 交互元素background-size过渡 · 平滑透明度过渡
文本链接显现下划线,按钮背景色过渡 · 即时视觉反馈
08
组件
- button 底部下划线边框的文本链接,全大写
- card 图片主导的产品卡片,叠加排版元素
- input 极简搜索框配图标触发器
- hero 全视口摄影图搭配居中白色文字
09
文案语气与禁用清单
- 语气 技术性、前瞻性、简洁
- 标题风格 短促有力的全大写语句
- 按钮文案 行动导向型,含性别分类(女款选购 / 男款选购)
- 禁用彩色强调按钮——截图显示应采用带下划线的文本链接
- 禁用卡片装饰性阴影——截图显示采用扁平化、图片优先的布局
- 禁用多栏复杂布局——截图显示采用简洁三栏产品网格
- 禁用圆角胶囊按钮——截图显示采用最小圆角的矩形元素
- 禁用渐变叠加层——截图显示摄影图保留原始状态,无色彩处理
- 禁用局促的小间距——截图显示版块间留白充裕
- 避免: 浮夸或过度随意的语言
- 避免: 装饰性UI元素
- 避免: 鲜艳强调色
10
包内真实截图
11
System Prompt
Arc'teryx是高端户外技术服装品牌。设计系统以单色方案为核心(#FFFFFF背景、#1A1A1A主色、#666666辅助色),视觉丰富性完全由摄影图片呈现。字体采用Helvetica Now Display(grotesque-sans),导航全大写,标题粗体展示型,正文0.32px字间距。布局采用全出血摄影英雄区衔接简洁三栏产品网格。核心约束:禁用彩色强调按钮(仅使用文本下划线)、避免卡片装饰阴影、保持充裕留白。摄影图禁止使用渐变叠加。该系统优先体现克制美学,让影像驱动情感共鸣,字体排印则建立清晰层级与技术权威感。







