精选 · 开放 · 免费
Vitaarchitecture
一份精致的建筑作品集，在严谨的极简主义与复杂的排版细节间取得平衡。
EditorialCleanRefinementStudioPortfolio
01
设计气质 DNA
建筑感极简编辑风格精致
一个带有微妙衬线点缀的纯净画廊空间。
02
色彩
#000000Ink
#EFEFEFBG
#9E9E9EMuted
rgba(0,0,0,1.0)Line
采用高对比度中性色进行极致克制，让建筑摄影得以自由呼吸。
03
字体
didone-serif · grotesque-sans
- display
196px · 200 - headline
48px · 400 - body
16px · 400
对大型、优雅的展示元素（如'214'数字）使用didone-serif字体。 · 对功能性UI、导航和标准段落文本使用grotesque-sans字体。 · 所有字体均保持紧凑的负字距，以维持精致的美感。
04
间距
4px
8px
16px
24px
32px
48px
64px
96px
宽敞的留白，配合孤立的垂直内边距，例如：上下各207px
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 999px
稀疏使用纤细、清晰的黑色线条进行分隔
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
单栏或高度结构化的非对称网格，以大量空白空间为主导
07
动效与交互
200msmicro
300mssmall
500msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
交互时的颜色渐变 · 元素的透明度过渡
交互元素上的微妙文字颜色变化。 · 立即响应，视觉反馈最小化。
08
组件
- button 纯文本，交互时带有简单的下划线或状态变化。
- card 以排版为主导，留白充裕，无背景容器。
- hero 稀疏的排版，包含一个巨大的didone-serif数字和一条细水平线。
09
文案语气与禁用清单
- 语气 自信、沉静且高度精致。
- 标题风格 极简，常使用大数字或单个词语。
- 按钮文案 含蓄、功能性的文本。
- 不要使用阴影——截图显示的是完全平坦的表面。
- 不要使用border-radius——截图显示的是锐利、未圆角的边角。
- 不要使用鲜艳的颜色——截图显示的是严格的单色/黑白。
- 不要使用投影——截图完全依赖扁平化设计。
- 不要让界面杂乱——截图显示的是极致的留白。
- 不要对展示文本使用sans-serif——截图中使用的是didone-serif字体作为大数字。
- 避免: 感叹号
- 避免: 营销流行语
- 避免: 色彩鲜艳的行动号召
- 避免: 装饰性UI元素
10
包内真实截图
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
这是一个精致的建筑作品集网站。它通过极致的克制、高端的极简主义和画廊般的项目展示来定位自身。关键色彩是非常浅的中性灰（#EFEFEF）背景搭配严格的黑色（#000000）墨水，营造出高对比度、严谨的感觉。字体采用复杂的搭配：用于大型展示元素（如'214'数字）的纤细didone-serif，以及用于导航和正文的干净、功能性的grotesque-sans。关键设计规则：保持宽敞、近乎广阔的留白；仅使用纤细、清晰的线条进行分隔；绝不引入阴影、border-radius或鲜艳的颜色。整体基调是自信、沉静且高级的。
en · zh-CN · zh-TW · ja · ko