01
设计气质 DNA
高端现代家具设计传承办公空间
建筑事务所作品集与高端电商目录的结合
02
色彩
#252525Ink#4C4C4CInk soft#FFFFFFBG#EBEBEBBG softrgba(37, 37, 37, 0.15)Line高对比度中性色,让产品摄影主导视觉层次
03
字体
- display
40px · 700 - heading
24px · 700 - body
16px · 400 - caption
14px · 400
所有排版使用人文主义无衬线字体 · 正文保持宽松的行高 (1.625) · 标题应用紧凑的字间距
04
间距
4px8px16px24px32px48px64px96px8像素基线网格,章节间采用宽松的垂直内边距 (48px-99px)
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 999px
使用低透明度墨色绘制的纤细、微妙的边框
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
首页与办公空间路径的双栏分区,在移动端堆叠为单栏
07
动效与交互
100msmicro
200mssmall
400msmedium
cubic-bezier(0.25, 0.1, 0.25, 1.0)easing
悬停时的颜色过渡 · 交互元素的位置过渡
文本链接上的微妙颜色过渡 · 即时的状态变化
08
组件
- button 基于文本的链接,带向右箭头,无可见按钮容器
- card 全出血图片,下方配文,无边框或阴影
- hero 大型标题搭配双栏图片网格
09
文案语气与禁用清单
- 语气 自信、专业且包容
- 标题风格 直接而陈述性,使用句子式大小写
- 按钮文案 带有箭头指示的行动导向文本,无按钮样式
- 不要使用投影——截图显示为完全扁平、无阴影的布局
- 不要为按钮使用彩色背景——截图显示为纯文本链接
- 不要在卡片周围使用粗边框——截图显示为无边框的图片卡片
- 不要使用繁杂的调色板——截图显示为白色背景的单色方案
- 不要对标题使用居中对齐——截图显示为左对齐的标题
- 不要使用装饰性字体——截图显示为功能性的、简洁的人文主义无衬线字体
- 不要在主要组件上使用圆角——截图显示为锋利的、方形的边缘
- 避免: 过多的感叹号
- 避免: 非正式俚语
- 避免: 术语密集的技术性词汇
10
包内真实截图
11
System Prompt
这是一个平衡传承设计与现代办公解决方案的高端家具电商网站。关键色彩包括用于背景的白色 (#FFFFFF)、用于文本的深墨色 (#252525) 以及用于页脚区域的柔灰色 (#EBEBEB)。字体采用人文主义无衬线字体 (Meta),主要使用 400 和 700 字重。布局在桌面端为整洁的双栏分区,在移动端堆叠为单栏。关键禁忌:切勿在扁平布局上添加投影,切勿使用彩色按钮背景(链接为纯文本),切勿在边缘锋利的卡片上应用圆角。设计优先考虑大型产品摄影,而非装饰性的UI元素。




