OpenDesign·你的设计资产库

网页参考

Bitofdenim

一个用于升级再造牛仔产品的极简编辑式电商网站。

EditorialPhotographicRestraintCalmPremium
Bitofdenim 网站截图

01

设计气质 DNA

可持续牛仔编辑式极简

一本高端时尚编辑杂志

02

色彩

#1A0A0EInk
#F2F2F1BG
#222222Muted
rgba(26,10,14,1.0)Line

高对比度、无彩色调,专注于排版和图像

03

字体

didone-serif · monospace

  • display280px · 700
  • heading28px · 300
  • body14px · 400

所有界面和正文文本使用 Space Mono · 主品牌名称使用 Meno Display Condensed · 导航文本保持简洁,使用大写或句首大写

04

间距

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

充足的留白和内边距

05

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

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

1px solid #1A0A0E

06

布局

1440container
12columns
24pxgutter
768 / 1024breakpoints

全宽主视觉区,采用非对称布局和大量负空间

07

动效与交互

220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing

透明度渐变 · 图片轮播

微妙的透明度变化 · 即时响应

08

组件

  • button 极简的轮廓矩形,文字大写
  • card 无可见卡片,产品图片直接呈现
  • input 简单的轮廓文本输入框
  • hero 大号字体搭配摄影棚拍摄的照片

09

文案语气与禁用清单

  • 语气 沉静、自信、具有编辑感
  • 标题风格 简短有力的短语,如 'No Denim Left Behind'
  • 按钮文案 简洁实用,例如 'Shop All' 或 'OK!'
  • 不要使用渐变 — 截图显示的是平面的纯色背景
  • 不要在容器上使用圆角 — 截图显示的是清晰的矩形边缘
  • 不要使用投影 — 截图显示的是没有立体效果的元素
  • 不要使用明亮的强调色 — 截图显示的是严格的单色调色板
  • 不要为导航使用无衬线字体 — 截图显示的是等宽字体
  • 不要使布局杂乱 — 截图显示的是充足的负空间和极简的元素
  • 避免: 过多的形容词
  • 避免: 喧闹或激进的语言
  • 避免: 杂乱的界面

10

包内真实截图

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

11

System Prompt

这是一个用于升级再造牛仔产品的极简编辑式电商网站。设计依赖高对比度、无彩色调,背景为浅灰色 (#F2F2F1),文字为近乎黑色 (#1A0A0E)。主视觉区采用巨大的衬线字体,所有其他界面元素使用等宽字体。关键颜色是 #F2F2F1 和 #1A0A0E。关键禁忌:避免使用渐变,避免在容器上使用圆角,避免使用不必要的元素使布局杂乱。布局宽敞,留有充足的负空间,强调排版和摄影。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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