精选 · 开放 · 免费
Dsanddurga
一个高端香氛与生活方式品牌,运用粗野主义风格的大胆排版和重网格的编辑型布局,营造出鲜明、前卫的美学。
EditorialPremiumConsumerGalleryStudio
01
设计气质 DNA
编辑型粗野主义高端奢华实用主义
高端杂志版面与粗野主义工业仓库的结合。
02
色彩
#1A1A1AInk
#555555Ink soft
#F2EDE4BG
#EAE4D9BG soft
#FFFFFFBG quiet
#888888Muted
rgba(26, 26, 26, 0.15)Line
采用高对比度的黑底奶油色排版,并搭配大型摄影主视觉元素,避免使用鲜艳的强调色,以保持一种精致、实用的感觉。
03
字体
grotesque-sans
- display
64px · 700 - headline
28px · 700 - body
14px · 400
导航和小标签使用全大写 · 大型展示文字使用紧凑的行高 (0.9 - 1.0) · 通过字重和大小写维持严格的排版层级,而非使用多样的字体家族
04
间距
8px
16px
24px
32px
48px
64px
80px
120px
不规则的网格节奏,由摄影布局和大型排版块决定,优先考虑视觉冲击力而非严格的垂直韵律。
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 999px
使用细薄的 1px 实线黑色边框来定义网格单元和边界,营造出一种严谨、结构化的布局。
06
布局
1440container
12columns
1pxgutter
768 / 1024breakpoints
严格的网格化布局,包含大型、高冲击力的摄影元素和覆盖式排版块。通常使用由硬质边框分隔的全出血图片。
07
动效与交互
200msmicro
300mssmall
500msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
文本叠加层的细微淡入效果 · 轮播图的平滑滑动
链接和按钮上的细微透明度变化。 · 提供即时反馈,略有缩放或透明度降低。
08
组件
- button 简单的文本链接或胶囊形按钮,通常为大写。
- card 由硬质边框定义的网格单元,包含图像和覆盖式排版。
- chip 简单的文本标签或徽章(例如,“限量联名款”)
- input 带有细边框的极简文本输入框。
- hero 大型、全宽的摄影图像,覆盖着粗体排版。
09
文案语气与禁用清单
- 语气 自信、直接,略带神秘感。
- 标题风格 简短、有力,常具概念性或挑衅性。
- 按钮文案 极简且功能性,通常仅为一个箭头或简单的文本链接。
- 不要使用投影或柔和渐变——截图显示的是具有硬质边框的平面、粗野主义美学。
- 不要使用多种字体家族——截图仅依赖于单一、一致的无衬线字体家族。
- 不要使用明亮、饱和的强调色——截图显示的是由黑色、奶油色和摄影构成的柔和调色板。
- 不要在容器上使用圆角——截图显示网格单元为尖锐的90度直角。
- 不要在大段文本中使用居中对齐——截图经常使用左对齐或齐左排版。
- 不要将导航隐藏在复杂的层级结构中——截图显示的是平面、可见的顶部导航栏。
- 避免: 过多的感叹号
- 避免: 过于描述性的形容词
- 避免: 泛泛的营销套话
11
System Prompt
DS&DURGA 是一个总部位于纽约的高端香氛与生活方式品牌。其网站采用了粗野主义、编辑型的设计方法。关键颜色为奶油色 (#F2EDE4)、深黑色 (#1A1A1A) 和柔和的离白色 (#EAE4D9)。排版始终使用一款粗体、紧字距的怪诞无衬线字体,应用于展示文字和正文。关键设计约束:主 UI 元素上绝不使用投影或圆角,避免使用明亮饱和的强调色,并且不使用多种字体家族。布局严格基于网格并带有硬质边框,优先考虑高冲击力的摄影和大型、有力的排版叠加。
把这份品味接进你的 Agent
把这套设计的机器可读规格——色彩、字体、动效,整套 DNA——直接交给你的 AI Agent。
OpenDesign 技能 ↗
en · zh-CN · zh-TW · ja · ko