01
设计气质 DNA
精品咖啡直接贸易烘焙商匠心工艺
一家具有精致编辑美学的精品咖啡烘焙品牌。
02
色彩
#E82C2AAccent#212529Ink#FFFFFFBG#F2F2F2BG soft#6C757DMutedrgba(232,44,42,0.5)Line以主导品牌红为核心，与洁净白色和浅灰色基础形成高对比度配对。
03
字体
- display
105px · 400 - heading
30px · 400 - body
20px · 400
展示字体采用高对比度的 Didone 衬线字体，呈现优雅、传统的视觉冲击力。 · 正文字体采用简洁的几何无衬线字体，确保现代可读性。 · 导航链接和正文采用标准字重，营造精致感。
04
间距
4px8px12px16px20px24px30px48px64px96px基于 4px 网格，搭配宽裕的内边距，营造通透、高级的感觉。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 12px
lg · 25px
pill · 999px
采用 1px 细边框，使用品牌红或浅灰色来划分版块。
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
简洁的网格布局，拥有大量留白和交替的全宽版块。
07
动效与交互
150msmicro
150mssmall
500msmedium
ease-in-outeasing
交互元素上的平滑颜色和背景过渡。 · 动态内容的渐进式淡入。
链接上细微的颜色或文本装饰变化。 · 标准的链接导航和产品选择。
08
组件
- button 红色的文本导航链接；几乎没有可见的实心按钮样式。
- card 产品卡片采用柔和的灰色背景，图像带有显著的圆角。
- hero 醒目的分屏主视觉，一侧是巨大的衬线字体，另一侧是圆角图像。
09
文案语气与禁用清单
- 语气 自信、平易近人，略带匠心。
- 标题风格 大型、优雅的衬线字体陈述，定义品牌的高端定位。
- 按钮文案 简洁、直接的文本链接，在不压倒设计的前提下引导用户。
- 勿使用小写品牌名称——截图显示 'REDBRICK' 为全大写。
- 勿使用霓虹色或高饱和度的强调色——截图显示的是克制、传统的红色。
- 勿使用过于复杂的几何图案——截图显示的是洁净的留白和简单的纯色背景。
- 勿在元素上使用厚重的盒阴影——截图显示的是扁平的、由边框或背景定义的表面。
- 勿使用随意的、圆润的无衬线展示字体——截图显示的是用于标题的优雅 Didone 衬线字体。
- 勿用众多小图标使界面杂乱——截图显示的是简洁、以文本为中心的导航。
- 避免: 厚重的投影效果
- 避免: 鲜艳、冲突的霓虹色
- 避免: 过于拥挤的布局
- 避免: 激进的大写文本
10
包内真实截图
11
System Prompt
此设计适用于一个高端、匠心的咖啡品牌。它巧妙地结合了用于展示文本的经典 Didone 衬线字体和用于正文排版的简洁几何无衬线字体。主要强调色是醒目的传统红色 (#E82C2A)，搭配洁净的白色背景 (#FFFFFF) 和柔和的浅灰色版块 (#F2F2F2)。布局拥有大量留白，采用大字体和高质量的产品图像，图像带有柔和的圆角。关键限制：切勿使用霓虹色或高饱和度强调色；主品牌名称务必使用全大写；避免使用厚重的投影以保持扁平的编辑美学。整体感觉应精致、高端且平易近人。