01
设计气质 DNA
手工植物精致有机工作室
一个阳光充沛的手工工作室,有机的肌理与编辑式的排版在此相遇。
02
色彩
#F5A73CAccent#000000Ink#F5F5F5BG#F1F1F0BG soft#6084B5Mutedrgba(0,0,0,1)Line一个由白色和温暖大地色调组成的、克制的中性色盘,让充满活力的高饱和度橙色点缀在有机的摄影图像中,成为唯一的、充满活力的焦点。
03
字体
- display
40px · 400 - h2
24px · 400 - body
16px · 400 - caption
12px · 400
所有主要标题和品牌标识使用 Signifier 字体。 · 功能性 UI 元素(如导航链接、按钮文本和标签)使用等宽字体。
04
间距
4px8px16px24px32px48px64px96px充足的内边距和章节间的大量留白,让图像得以充分呼吸。
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 999px
极简或不存在;依靠间距和背景色变化来实现分隔。
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
采用全出血摄影背景搭配叠加排版,过渡到用于产品展示的干净白色网格。
07
动效与交互
220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.46, 0.45, 0.94)easing
0.5 秒内平滑的不透明度与背景色过渡。 · 用于呈现动画的微妙高度变化。
微妙的鼠标指针状态变化,可能伴随不透明度或颜色偏移。 · 标准的指针状态。
08
组件
- button 仅文本的按钮,使用等宽字体,悬停时带下划线,无背景色。
- card 干净的白色背景,居中的产品摄影,搭配堆叠的衬线字体排版。
- chip 未见可见样式。
- input 极简的文本输入框,仅有单条底部边框。
- hero 全出血摄影背景,叠加超大字号、字间距紧凑的衬线体品牌名称。
09
文案语气与禁用清单
- 语气 手工感、个性化且富有吸引力。
- 标题风格 优雅、字间距紧凑的衬线字体,引人注目。
- 按钮文案 低调、功能性的等宽字体文本,通常大写。
- 不要使用侵略性的高饱和度颜色——截图显示的是克制、大地色系的色盘。
- 不要使用圆角或柔和边框——截图显示的是锐利的、零半径边缘。
- 不要使用厚重的投影——截图依赖间距和图像对比度。
- 不要为标题使用无衬线字体——截图使用过渡衬线体进行展示。
- 不要用密集的 UI 元素使布局显得拥挤——截图优先考虑充足的留白。
- 不要为标题使用等宽字体——截图将其保留给功能性 UI。
- 避免: 刺眼、侵略性的颜色
- 避免: 刻板、企业化的布局
- 避免: 活泼、圆润的几何形状
10
包内真实截图
















11
System Prompt
这是一个高端、手工感的纺织品牌电商平台。设计 DNA 由一个克制、温暖的中性色盘(#F1F1F0,#F5F5F5)定义,让高质量的植物摄影得以呼吸。排版结合了用于展示和正文的精致过渡衬线体(Signifier),以及用于导航和按钮等功能性 UI 元素的简洁等宽字体(SohneMono)。单一的高饱和度橙色点缀(#F5A73C)仅少量用于新闻通讯弹窗。关键禁忌:绝不使用侵略性或霓虹色,绝不使用圆角或投影,并始终优先考虑充足的间距而非拥挤的布局。整体美学是编辑式且精致的,高度依赖摄影叙事。