精选 · 开放 · 免费
Nathansmith
一个极简的单色作品集网站,通过极致字体比例与大量负空间,营造高端、画廊般的展示效果。
PortfolioTypographyBoldCurationStudio
01
设计气质 DNA
极简高端艺术指导大胆编辑风
一个高端的单色艺术画廊。
02
色彩
#F5F4EEInk
#FFFFFFInk soft
#000000BG
#333333Muted
rgba(245, 244, 238, 1)Line
极致的单色极简主义,依赖字体排印与负空间。
03
字体
transitional-serif · geometric-sans
- display
80px · 400 - body
16px · 400 - caption
14px · 400
展示文本使用过渡衬线体 · 正文文本使用几何无衬线体 · 所有展示元素确保使用大写字母
04
间距
4px
8px
16px
24px
32px
48px
64px
96px
128px
慷慨的垂直与水平间距,留有巨大空隙
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 8px
lg · 12px
pill · 999px
无可见边框,依赖负空间分隔
None: None
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
不对称、边缘锚定,中央留有大量负空间
07
动效与交互
220msmicro
500mssmall
1000msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
淡入 · 色彩偏移 · 透明度变化
所有可交互元素显示手形指针 · 即时视觉反馈
08
组件
- button 深色背景、浅色文字的药丸形按钮
- card 用于奖项的极简浮动卡片,带深阴影
- chip 药丸形标签
- hero 大量空白空间,边缘锚定一个巨大的字体排印元素
09
文案语气与禁用清单
- 语气 沉静、自信、专业
- 标题风格 粗体、全大写、巨大比例
- 按钮文案 极简、基于文字,带箭头指示
- 不要使用多种颜色——截图显示为严格的黑、白、米白单色配色
- 不要居中对齐文本——截图显示为左对齐、边缘锚定的字体排印
- 不要使用紧凑间距——截图显示元素间留有巨大、空旷的负空间
- 不要使用狭小、拥挤的布局——截图显示为极简、画廊般的构图
- 不要使用复杂背景——截图显示为纯色、平整的黑色背景
- 不要使用装饰性边框——截图显示元素通过空间而非线条分隔
- 避免: 装饰性元素
- 避免: 杂乱布局
- 避免: 鲜艳色彩
10
包内真实截图
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
一个艺术总监的极简作品集网站。设计严格采用单色系,使用黑色背景 (#000000) 和米白色文本 (#F5F4EE),搭配过渡衬线展示字体和几何无衬线正文字体。其特点是标题采用巨大字体比例,以及大量空旷的负空间,以营造高端、画廊般的氛围。浮动UI元素使用深邃阴影和药丸形状。关键约束:保持严格的单色配色,运用巨大负空间,并将所有字体排印锚定到视口边缘。
en · zh-CN · zh-TW · ja · ko