OpenDesign·你的设计资产库

网页参考

Knickey

一个为包容性内衣设计的精致、以图片为主导的电子商务界面。

ConsumerCleanPhotographicCalmRefined

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

01

设计气质 DNA

内衣包容性可持续简约舒适

一个安静、精心策划的目录，让产品摄影自由呼吸。

02

色彩

#233735Accent
#241f20Ink
#f5f4eeBG
#8bba78Muted
rgba(36,31,32,1.0)Line

大地色中性色与柔和的绿色共同营造出平静、有机的调色板。

03

字体

didone-serif · humanist-sans

  • display64px · 400
  • headline32px · 400
  • body17px · 400
  • caption14px · 400

为重要数字和大号强调文本使用 didone-serif 字体。 · 为所有交互元素和正文使用 humanist-sans 字体。 · 在无衬线字体元素上保持一致的宽字间距。

04

间距

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

使用 4 和 8 的倍数作为一致的内边距，营造出通透的布局。

05

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

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

除复选框输入外，无可见边框；模态窗口依赖间距和背景对比度。

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

分屏布局，全出血摄影图片环绕着居中的文本栏。

07

动效与交互

200msmicro
300mssmall
800msmedium
cubic-bezier(0.19, 1, 0.22, 1)easing

模态叠加层的淡入淡出和缩放进入效果。 · 交互元素的微妙变换过渡效果。

按钮上的微妙背景色过渡效果。 · 通过右上角的小 'X' 图标关闭模态窗口。

08

组件

  • button 实心深色矩形按钮，白色大写文字，无圆角。
  • card 以图片为主、无边框的卡片，依赖摄影而非容器。
  • chip 无可见组件。
  • input 自定义复选框，带圆角和柔和灰色边框。
  • hero 全屏或大型模态叠加层，采用摄影图片与居中文本的分割构图。

09

文案语气与禁用清单

  • 语气 自信、平静且友善。
  • 标题风格 简短、直接、聚焦价值（例如 'You've Got 15% Off'）。
  • 按钮文案 清晰、大写、面向行动（例如 'CLAIM 15% OFF'）。
  • 不要使用厚重的投影——截图显示的是平坦、无边框的表面。
  • 不要使用明亮、高饱和度的点缀色——截图显示的是柔和的绿色和深青色。
  • 不要为展示文字使用活泼或圆润的无衬线字体——截图显示的是锋利的 didone-serif 字体。
  • 不要将长段落文本居中对齐——截图显示文本栏窄而居中，仅适用于短文案。
  • 不要为内容卡片添加不必要的边框——截图显示的是无边框的图像。
  • 不要使用深色模式或高对比度主题——截图显示的是浅色、奶油色的灰白色背景。
  • 避免: 激进或紧迫的语言
  • 避免: 过于随意或俚语化的表达
  • 避免: 视觉杂乱或嘈杂的背景

10

包内真实截图

Knickey — 桌面首屏（hero）
桌面首屏（hero）
Knickey — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Knickey — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Knickey — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Knickey — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Knickey — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Knickey — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Knickey — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Knickey — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Knickey — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Knickey — 移动首屏
移动首屏

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

11

System Prompt

这是一个为可持续内衣品牌设计的精致电子商务界面，以平静的大地色调为特色。关键颜色包括奶油色灰白色背景（#f5f4ee）、深墨色文本（#241f20）、柔和绿色点缀色（#8bba78）以及用于主按钮的深青色（#233735）。字体排印将用于大号展示文本的锋利 didone-serif 字体与用于所有正文和 UI 元素的 humanist-sans 字体相结合。布局宽敞，常采用分屏构图，全出血摄影图片环绕居中文本。关键禁忌：不要使用明亮、霓虹色彩；避免厚重边框或投影；不要使用活泼、圆润的字体；避免杂乱背景；不要将大段文本居中对齐；避免使用激进、紧迫的营销语言。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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