01
设计气质 DNA
街头服饰高端极简大胆编辑风
以简洁编辑杂志形式呈现的高端街头服饰图录。
02
色彩
#AE0200Accent#000000Ink#575757Ink soft#F7F7F7BG#C7C7C7Mutedrgba(0,0,0,0.1)Line高对比度单色体系,辅以单一深红色用于强调。
03
字体
- display
48px · 700 - h2
32px · 600 - body
16px · 400 - caption
12px · 400
导航、标签及次级UI元素使用大写字母。 · 大型展示字体保持紧密字间距。
04
间距
4px8px12px16px24px32px48px64px80px96px8px基础单位,配合4px微调步进,用于紧凑的UI元素。
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 9999px
1px solid rgba(0,0,0,0.1)
rgba(0, 0, 0, 0.3) 0px 0px 24px 0px
06
布局
1440container
12columns
24pxgutter
768 / 1024breakpoints
全出血摄影搭配叠加文字,过渡至产品列表的整洁网格。
07
动效与交互
200msmicro
300mssmall
500msmedium
ease-in-outeasing
悬停与滚动时平滑的透明度与变换过渡。 · 图像切换的微妙淡入淡出。
交互元素在悬停时产生细微透明度变化或轻微缩放。 · 通过过渡效果提供即时视觉反馈。
08
组件
- button 纯黑色矩形按钮搭配白色大写文字,偶尔出现胶囊形变体。
- card 无边框的整洁产品卡片,聚焦于图像展示。
- chip 用于筛选的大写粗体文字标签。
- input 极简输入框,采用1px实线底部边框。
- hero 全屏、高冲击力的摄影首屏,叠加排版文字。
09
文案语气与禁用清单
- 语气 极简、直接、高端。
- 标题风格 粗体、大写、紧凑。
- 按钮文案 行动导向、大写、高度醒目。
- 勿使用装饰性字体——截图显示严格依赖粗体无衬线字体。
- 勿在主要UI元素上使用圆角——截图显示为利落的直角边缘。
- 勿使用多色配色——截图显示为严格的单色基底搭配单一红色点缀。
- 勿在卡片上使用细微投影——截图显示为平面或非常厚重、特定的阴影。
- 勿在主要导航中使用混合大小写——截图显示UI标签均采用大写。
- 勿使用柔和、柔和的背景色——截图显示为纯白或浅灰(#F7F7F7)基底。
- 避免: 手写字体
- 避免: 艳丽渐变
- 避免: 杂乱布局
10
包内真实截图
11
System Prompt
这是一个高端街头服饰时尚网站,采用极简编辑美学。设计DNA植根于高对比度单色体系(黑色#000000搭配白色#F7F7F7),使用粗体、大写无衬线字体(STKBureau)。布局高度依赖全出血摄影首屏与结构化12列网格。关键点缀色为深红色(#AE0200)。关键禁忌:主要元素勿使用圆角,勿引入装饰性或手写字体,勿使用多色配色。整体感觉干净、大胆且高度克制。



