精选 · 开放 · 免费

Wieden+Kennedy

一个大胆、电影感的代理机构作品集，通过沉浸式摄影和大尺度排版展示高冲击力的创意作品。

01

设计气质 DNA

一个电影感的电影节节目单

02

色彩

高对比度的电影感色调，依赖于在深邃黑色和丰富摄影背景上的醒目白色文字

03

字体

grotesque-sans

• display68px · 300
• h232px · 300
• body16px · 300

字体粗细主要为 300（轻盈），营造精致、透气的感受 · 使用大尺寸展示文字（68px）以增强冲击力 · 展示标题采用紧凑的字间距

04

间距

非对称布局，配合大块填充（75px、96px），创造开放、电影感的呼吸空间

05

表面 (圆角 / 阴影 / 边线)

纤细的 1px 边框，谨慎使用，主要用于结构性分隔

rgba(0, 0, 0, 0.25) 0px 0px 5px 0px

06

布局

全出血摄影主视觉，文字叠加其上，过渡到结构化网格布局以展示作品

07

动效与交互

内容过渡使用不透明度渐变（0.75秒） · 基于滚动的显示使用变换移动（0.5秒） · 交互状态使用颜色过渡（0.25秒）

交互元素上光标变为指针；细微的颜色或不透明度变化 · 标准指针交互

08

组件

• button 简约的文字按钮，有时为大写
• card 无可见边框的大型摄影卡片，依赖图像边缘
• chip 未观察到
• input 未观察到
• hero 全视口电影感图像，底部左下方叠加大型、轻盈的排版文字

09

文案语气与禁用清单

• 语气 自信、含蓄且艺术化
• 标题风格 大型、轻盈（300）、小写或首字母大写，标点极少
• 按钮文案 简洁的大写文本链接

• 不要使用粗重的字体粗细——截图显示轻盈（300）粗细占主导
• 不要应用明亮的饱和强调色——截图显示单色/摄影色调色板
• 不要在卡片或容器上使用圆角——截图显示尖锐的方形边缘
• 不要使用紧凑间距挤压元素——截图显示大填充和留白（75px-96px）
• 不要使用装饰性或衬线字体——截图显示干净的 grotesque-sans
• 不要依赖复杂的背景纹理——截图显示纯黑或摄影填充
• 避免: 避免杂乱的布局或复杂的背景图案
• 避免: 避免使用粗重的字体粗细（保持在 300-500 范围）
• 避免: 避免明亮的霓虹或饱和的强调色
• 避免: 避免复杂的导航菜单；保持极简
• 避免: 避免装饰性衬线字体
• 避免: 避免在主要 UI 元素上使用圆角

10

包内真实截图

抓自真实页面 · 真 computed styles

11

System Prompt

en · zh-CN · zh-TW · ja · ko