OpenDesign·你的设计资产库

网页参考

Drepute

一个简洁、富有氛围感的预发布页面,配有突出的摄影主视觉和清晰的行动号召。

EditorialPhotographicCleanCalmPremium

封面待补录,可通过原站查看设计。

01

设计气质 DNA

预发布极简氛围感专业

一个高端的预发布等候室,让产品自己说话。

02

色彩

#ffffffInk
#161616BG
#a9a9a9Muted
rgba(0, 0, 0, 0.3)Line

以摄影背景为主的高对比度单色方案。

03

字体

transitional-serif · humanist-sans

  • display62px · 400
  • h244px · 400
  • body16px · 400

04

间距

4px
8px
16px
24px
32px
48px
56px
64px
96px

基于8像素的网格,章节间距宽裕(垂直方向56像素)。

05

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

sm · 4px
md · 4px
lg · 0px
pill · 999px

1px solid #000000

rgba(0, 0, 0, 0.3) 0px 2px 6px 0px · rgba(0, 0, 0, 0.25) 0px 3px 18px 0px

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

全宽摄影主视觉,后跟居中的内容区块。

07

动效与交互

150msmicro
300mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing

页面加载元素使用1秒缓动过渡

按钮的背景过渡效果。 · 交互元素使用标准指针光标。

08

组件

  • button 实心白色背景,黑色大写文字,小圆角。
  • input 深色背景,带纤细的白色边框。
  • hero 全视口高度,文字居中,配有大型背景图。

09

文案语气与禁用清单

  • 语气 极简且充满期待。
  • 标题风格 页面居中的简短、大号衬线字体。
  • 按钮文案 直接且功能性(例如,“了解更多”、“接受”)。
  • 不要使用明亮或霓虹色板——截图显示的是深沉、有氛围感的摄影主题
  • 不要使用小而局促的文字——截图显示的是宽裕的间距和大号标题
  • 不要使用复杂的网格布局——截图显示的是简单的单栏居中布局
  • 不要使用圆润、泡泡状的按钮——截图显示的是棱角分明、仅带最小圆角的矩形按钮
  • 不要使用装饰性或手写体字体——截图显示的是清晰的衬线与无衬线字体搭配
  • 不要使用繁杂的导航——截图显示的是只有一个按钮的简洁页眉
  • 避免: 赘语
  • 避免: 长句
  • 避免: 繁杂的界面模式

10

包内真实截图

历史提取与模型分析 · 尚未逐项校验

11

System Prompt

这是一个名为Drepute的品牌的极简预发布页面。设计以深沉、富有氛围感的摄影背景和高对比度白色排版为特点。色彩方案几乎完全是单色调,采用深炭灰色背景(#161616)和纯白色文字(#ffffff)。排版方面,标题使用过渡衬线字体,正文使用人文无衬线字体。关键交互包括简单的按钮悬停效果和页面过渡。关键设计规则包括:保持高对比度单色方案,使用宽裕的留白和章节间距(56像素),避免使用任何明亮的强调色或复杂的多栏布局。

把这份品味接进你的 Agent

把这套设计的机器可读规格——色彩、字体、动效,整套 DNA——直接交给你的 AI Agent。

OpenDesign 技能 ↗

复制给 Agent

参考链接与来源说明,可复制给 Agent。