精选 · 开放 · 免费
Wgsn
全球领先的趋势预测平台。
PremiumEditorialProductivityCurationAgency
01
设计气质 DNA
趋势预测未来洞见高端
高端时尚编辑杂志与企业级 SaaS 仪表盘的结合。
02
色彩
#000000Ink
rgba(0,0,0,0.6)Ink soft
#FFFFFFBG
#F5F5F5BG soft
#999999Muted
以高对比度黑白为基底的单色方案，让图像提供主要色彩。
03
字体
humanist-sans · monospace
- display
56px · 700 - h2
48px · 400 - body
18px · 400
所有文本层均使用 DM Sans。 · 保持正文易读性，采用充裕的行高。 · 大型展示文本使用紧凑的字间距。
04
间距
4px
8px
16px
24px
32px
48px
64px
96px
充裕的留白，以体现高端定位。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 16px
lg · 40px
pill · 999px
1px 细边框，颜色为 rgba(0,0,0,0.6)。
rgb(0, 0, 0) 0px 0px 0px 1px inset
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
标准的居中容器，采用分屏式首屏布局。
07
动效与交互
220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
交互元素上平滑的背景色过渡。
按钮与链接的背景色变化。 · 即时的视觉反馈。
08
组件
- button 药丸形按钮，圆角半径 40px，采用高对比度（白底黑字或黑底白字）。
- card 圆角矩形（16px 半径），包含图像与文字叠加层。
- chip 不适用
- input 不适用
- hero 大型分屏布局，一侧为趋势图像拼贴，另一侧为醒目的字体排印。
09
文案语气与禁用清单
- 语气 权威、富有远见且专业。
- 标题风格 简短、有力且面向未来（例如：“创造明天”）。
- 按钮文案 直接且以行动为导向（例如：“申请演示”）。
- 不要使用明亮的霓虹色——截图显示为严格单色的黑白基底。
- 不要使用尖锐的 0px 圆角——截图显示为药丸按钮（40px）和圆角卡片（16px）。
- 不要在标题中使用宽字间距——截图显示为紧凑的字间距（-1px）。
- 不要在标题中使用细字体——截图显示为粗体/半粗体的展示文字。
- 不要使用杂乱的背景——截图中的章节使用纯黑、纯白或浅灰色。
- 不要使用小而紧凑的文本——截图使用充裕的 18px 正文，行高较高。
- 避免: 随意俚语
- 避免: 被动语态
- 避免: 过于技术化的行话
10
包内真实截图
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
WGSN 是一个高端的 B2B 趋势预测平台，采用精致的编辑式设计语言。其色彩方案严格单色，使用纯黑（#000000）和纯白（#FFFFFF），并利用半透明黑色构建层次，灰色（#999999）用于柔和元素。字体排印完全使用 DM Sans，一种人文主义无衬线字体，从粗体 56px 标题到 18px 正文。按钮为药丸形（40px 半径），填充色对比度高。布局宽敞居中，强调大型趋势图像。关键约束：绝不使用强调色，绝不为按钮使用尖锐圆角，绝不让文本显得紧凑。在所有文案中保持权威而富有远见的语调。
en · zh-CN · zh-TW · ja · ko