精选 · 开放 · 免费

Swoosh Nike

一个极简、图像优先的平台，用于发现和购买高端运动鞋。

01

设计气质 DNA

独家运动鞋发售的精选画廊

02

色彩

米白背景上的高对比度黑色，品牌红色仅在图像中点缀使用

03

字体

grotesque-sans

• display53px · 500
• headline20px · 500
• body16px · 500
• caption14px · 400
• label12px · 500

使用 Helvetica Now Text 或等效的 grotesque-sans 字体 · 主要文本保持中等字重（500） · 展示尺寸的字距保持紧凑

04

间距

一致的基于4px的间距系统，采用标准增量

05

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

1px细边框，颜色为 rgba(17,17,17,0.1)

0px 4px 8px 0px rgba(17,17,17,0.06) · 0px 0px 24px 4px rgba(17,17,17,0.03) · 0px -1px 0px 0px rgb(229,229,229) inset

06

布局

图片卡片下方带文字的四栏网格

07

动效与交互

内容加载时的平滑淡入效果 · 细腻的背景过渡

细腻的背景色变化或缩放效果 · 通过降低不透明度提供即时视觉反馈

08

组件

• button 药丸形按钮，黑色背景，白色文字
• card 图片优先的卡片，圆角，下方展示产品信息
• chip 用于分类的简单文字标签
• input 简洁的文本输入框，带底部边框
• hero 全宽图像，叠加文字或极简背景

09

文案语气与禁用清单

• 语气 直接、信息丰富、以产品为中心
• 标题风格 加粗且简洁的产品名称
• 按钮文案 行动导向的按钮，如“了解更多”

• 不要使用渐变背景——截图显示为纯色米白（#F5F5F5）或白色（#FFFFFF）背景
• 不要使用装饰性衬线字体——截图显示所有文本使用 Helvetica Now（grotesque-sans）
• 不要使用浓重的投影——截图显示非常细微的阴影（0.06 不透明度）或无阴影
• 不要将产品文本居中对齐——截图显示产品名称和描述为左对齐
• 不要使用复杂的卡片布局——截图显示简单的图片卡片，下方带文字
• 不要使用多种强调色——截图显示中性色板，品牌红色仅出现在产品图像中
• 避免: 过度热情或促销性的语言
• 避免: 复杂的技术描述
• 避免: 非正式俚语，除非是产品名称的一部分

10

包内真实截图

抓自真实页面 · 真 computed styles

11

System Prompt

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