精选 · 开放 · 免费
Audemars Piguet
为爱彼打造的高端社论式体验,强调传承、电影级摄影与克制的奢华感。
watchesluxury
01
设计气质 DNA
传承精致瑞士工艺永恒
一部融合传承与现代叙事的电影感时尚社论。
02
色彩
#ffffffInk
#8b8c8cInk soft
#000000BG
#f6f5f3BG soft
#808080Muted
rgba(139, 140, 140, 0.3)Line
严格的单色调色板(黑、白、冷灰),以让摄影内容占据主导。
03
字体
transitional-serif · humanist-sans
- display
60px · 300 - body
16px · 300 - caption
14px · 300
用于高冲击力社论标题的过渡衬线字体。 · 用于所有界面元素、导航及正文的人文无衬线字体。 · 大写说明文字保持充裕的字间距。
04
间距
4px
8px
16px
24px
32px
48px
64px
96px
120px
采用充裕的垂直韵律与大段落内边距(100px+)来界定内容区域。
05
表面 (圆角 / 阴影 / 边线)
sm · 2px
md · 3px
lg · 0px
pill · 999px
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
全出血首图区域过渡至黑色、内容受限的社论式区块。
07
动效与交互
220msmicro
300mssmall
500msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
交互元素上平滑的色彩与背景过渡。
通过 0.3s 的 ease-in-out 过渡实现微妙的色彩变化。 · 可能通过透明度或色彩变化提供微妙反馈。
08
组件
- button 极简文本链接,以水平线前缀取代传统边框。
- card 用于社论叙事的大幅、通栏摄影卡片。
- input 采用高对比度黑白样式的标准 Cookie 同意按钮。
- hero 全视口电影级摄影,叠加衬线字体排版。
09
文案语气与禁用清单
- 语气 精致、诗意且以叙事为驱动。
- 标题风格 采用大号细衬线字体,常使用斜体以示强调。
- 按钮文案 微妙而低调,使用线条图标和小写文本。
- 避免使用明亮或霓虹强调色——截图显示为严格的单色调色板。
- 避免为界面元素使用厚重、块状的边框——截图显示为精致的 1px 线条或无边框文本链接。
- 避免为标题使用粗重、加粗的字体——截图显示为纤细、轻量的衬线字体。
- 避免将所有文本内容居中——截图显示为强有力的左对齐排版布局。
- 避免使用传统的矩形按钮——截图显示为带有水平线前缀的文本链接。
- 避免在界面中使用多种相互竞争的字体——截图显示为严格的衬线/无衬线字体配对。
- 避免: 紧迫性驱动的语言
- 避免: 激进的行动号召按钮
- 避免: 营销术语
- 避免: 繁忙或杂乱的界面
10
包内真实截图
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
这是一个为爱彼打造的高端奢华腕表网站。其设计 DNA 深具电影感和社论风格,优先呈现高质量摄影而非界面元素。关键十六进制色值为 #000000 用作主要背景,#ffffff 用作文本,营造高对比度的单色基底。字体类别中,过渡衬线用于展示性标题,人文无衬线用于正文。关键禁忌:勿使用明亮或霓虹强调色;勿为 UI 元素使用厚重、块状的边框;勿为标题使用粗重、加粗的字体。布局以全出血首图和充裕的垂直间距定义,营造精致、从容的浏览体验。
en · zh-CN · zh-TW · ja · ko