精选 · 开放 · 免费
Varierfurniture
一个以极致克制、单色调色板和慷慨呼吸空间定义的高端家具品牌网站。
PremiumRestraintCleanCalmRefined
01
设计气质 DNA
极简斯堪的纳维亚家具人体工学高端
一个宁静的斯堪的纳维亚展厅,拥有充足的留白和克制的排版。
02
色彩
#494949Ink
#696969Ink soft
#FFFFFFBG
#CFCFCFBG soft
#9C9C9CMuted
rgba(156,156,156,1)Line
使用白色、黑色以及一系列受控的暖灰色的严格单色调色板。
03
字体
geometric-sans
- display
56px · 400 - h1
24px · 400 - body
16px · 400
所有文本层级均使用几何无衬线字体 · 所有元素一致使用细体或常规字重(400) · 所有文本均应用充足的字间距,以提升可读性和优雅感
04
间距
4px
8px
16px
24px
32px
48px
64px
96px
慷慨的垂直间距,主要内容块周围有显著的内边距(垂直内边距 78px 到 109px)。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 8px
lg · 12px
pill · 999px
用于按钮和轮廓的柔和灰色(#9C9C9C)1px 实线边框
rgba(0, 0, 0, 0.1) 0px 8px 10px -6px · rgba(0, 0, 0, 0.1) 0px 20px 25px -5px
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
居中的单栏布局,严格对齐视口中心。
07
动效与交互
150msmicro
200mssmall
400msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
交互元素的背景颜色和平滑的颜色过渡 · 悬停状态的变换过渡
按钮和导航链接上微妙的背景颜色或颜色过渡(0.15秒-0.25秒)。 · 交互元素使用标准指针光标。
08
组件
- button 药丸形按钮,填充深灰色并配以白色文字,或透明背景配以 1px 灰色边框。
- card 在此页面上不存在或极少;内容依赖于纯白色平面。
- chip 在此页面上不存在。
- input 在此页面上不存在。
- hero 一个巨大的、垂直居中的文本块,具有极大的顶部/底部内边距,无图像。
09
文案语气与禁用清单
- 语气 冷静、专业、直接。
- 标题风格 简短、清晰,完全摒弃营销辞藻。
- 按钮文案 以行动为导向且礼貌(例如,“返回首页”,“接受 cookie”)。
- 不要使用明亮、饱和的颜色——截图显示了严格的白色、黑色和灰色单色调色板。
- 不要使用粗重的字重——截图显示所有文本一致使用常规(400)字重。
- 不要创建密集、拥挤的布局——截图显示了慷慨的留白和内边距(垂直 78px-109px)。
- 不要在主要按钮上使用尖锐的直角——截图显示为药丸形(999px)按钮。
- 不要到处使用投影——截图显示阴影仅存在于特定的聊天组件和极简的交互状态上。
- 不要添加不必要的装饰元素——截图显示了一个非常干净、极简的界面,无插图。
- 避免: 明亮或饱和的颜色
- 避免: 过多的标点符号或表情符号
- 避免: 密集的文本块
- 避免: 夸张或侵略性的排版
10
包内真实截图
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
设计一个高端、受斯堪的纳维亚风格启发的家具网站,特点是极致的克制与宁静。使用严格的单色调色板,包括纯白背景(#FFFFFF)、深灰墨色(#494949)、中度柔和灰色(#696969、#9C9C9C)和浅灰表面(#CFCFCF)。不应使用高饱和度的强调色。使用干净的几何无衬线字体作为所有展示和正文字体,保持常规(400)字重和充足的字间距。布局必须居中、极简,并拥有大量留白,尤其是在标题周围。关键禁忌:永远不要使用明亮或饱和的颜色,永远不要使用粗体或重字重,永远不要创建密集或拥挤的内容块。
en · zh-CN · zh-TW · ja · ko