01
设计气质 DNA
高端行李箱旅行极简多彩
一个高端旅行品牌,将编辑式时尚摄影与干净、现代的电商设计相融合。
02
色彩
#1A1A1AInk#4D4D4DInk soft#FFFFFFBG#808080Mutedrgba(179, 179, 179, 1.0)Line以干净的白色画布为基础,搭配深炭灰色文字和柔和的灰色,依靠充满活力的产品摄影提供色彩。
03
字体
- display
60px · 400 - heading
32px · 400 - body
16px · 400 - label
11px · 500
大尺寸展示标题使用过渡衬线体,营造编辑感 · 导航和正文使用人文无衬线体,以保持清晰的可读性 · 为小号的大写标签和导航项应用宽字间距 · 导航和行动号召文本使用全大写 · 正文内容保持充足的行高以确保可读性
04
间距
4px8px16px24px32px48px64px96px章节间使用充裕的垂直间距,组件内部使用紧凑、可控的间距。
05
表面 (圆角 / 阴影 / 边线)
sm · 2px
md · 4px
lg · 8px
pill · 999px
极少使用柔和灰色调的1px边框,主要用于分隔和输入框。
rgba(100, 100, 100, 0.2) -7.5px 7.5px 15px 0px
06
布局
1400container
12columns
24pxgutter
768 / 1024breakpoints
全出血的主图,配以居中、层叠的文字和一个中央行动号召按钮。
07
动效与交互
200msmicro
300mssmall
500msmedium
cubic-bezier(0.25, 0.1, 0.25, 1.0)easing
交互元素在悬停时平滑过渡 · 内容出现时的透明度渐变 · 元素展开时的宽度和高度变化
交互元素上有细微的颜色过渡,保持干净的美学。 · 提供即时响应,并平滑过渡到下一状态。
08
组件
- button 带有白色边框的描边按钮,文字大写,保持极简和干净的外观。
- card 干净、边缘到边缘的摄影,叠加文字极少,强调产品生活方式。
- input 简洁的描边输入框,带有柔和的灰色边框。
- hero 分屏或全出血的摄影主视觉,配以大尺寸、居中的衬线体排版。
09
文案语气与禁用清单
- 语气 自信、精致且具有编辑感,聚焦于品质与设计。
- 标题风格 简短、富有感染力,常以大号过渡衬线字体呈现。
- 按钮文案 直接且以行动为导向,始终以大写形式呈现,并带有宽字间距。
- 不要使用单一的高饱和度强调色——该网站使用中性色板,色彩由产品摄影提供。
- 不要使用深色模式或深色背景——主背景始终是干净的白色。
- 不要为大尺寸展示标题使用无衬线体——该网站主标题一致使用过渡衬线体。
- 不要为导航使用小而紧的字间距——所有导航项都使用宽字距。
- 不要使用投影或厚重的渐变——设计依赖于干净的摄影和纯色。
- 不要使用密集或杂乱的网格——布局使用充裕的留白和大尺寸的全出血图像。
- 避免: 随意或过于热情的语言
- 避免: 过多的感叹号或推销味过重的文案
- 避免: 杂乱或繁忙的视觉布局
- 避免: 明亮、霓虹或过度饱和的强调色
10
包内真实截图
11
System Prompt
一个高端行李箱电商品牌,呈现干净、极简的美学,采用编辑式时尚摄影风格。核心色板为白色(#FFFFFF),搭配深炭灰色(#1A1A1A)文字和柔和的灰色(#808080, #B3B3B3),让充满活力的产品摄影提供色彩。排版将用于大尺寸展示标题的过渡衬线体与用于正文和导航的人文无衬线体相结合。关键禁忌:1) 避免使用高饱和度强调色;该网站依赖中性色调和丰富的摄影。2) 不要使用深色背景;它始终是干净的白色画布。3) 避免为大尺寸展示标题使用无衬线体;该网站使用衬线体作为主标题,以营造编辑感。









