精选 · 开放 · 免费
Bitofdenim
一个用于升级再造牛仔产品的极简编辑式电商网站。
EditorialPhotographicRestraintCalmPremium
01
设计气质 DNA
可持续牛仔编辑式极简
一本高端时尚编辑杂志
02
色彩
#1A0A0EInk
#F2F2F1BG
#222222Muted
rgba(26,10,14,1.0)Line
高对比度、无彩色调，专注于排版和图像
03
字体
didone-serif · monospace
- display
280px · 700 - heading
28px · 300 - body
14px · 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
包内真实截图
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
这是一个用于升级再造牛仔产品的极简编辑式电商网站。设计依赖高对比度、无彩色调，背景为浅灰色 (#F2F2F1)，文字为近乎黑色 (#1A0A0E)。主视觉区采用巨大的衬线字体，所有其他界面元素使用等宽字体。关键颜色是 #F2F2F1 和 #1A0A0E。关键禁忌：避免使用渐变，避免在容器上使用圆角，避免使用不必要的元素使布局杂乱。布局宽敞，留有充足的负空间，强调排版和摄影。
en · zh-CN · zh-TW · ja · ko