精选 · 开放 · 免费
Michaelspeichert
一个为设计工作室打造的、以排版为核心的冷峻作品集。
Bold TypographyPortfolioStudioCurationMonochrome
01
设计气质 DNA
排版粗犷实验性作品集黑白
一座通过激进、超大字号与高对比图形进行表达的野蛮主义艺术画廊。
02
色彩
#FFFFFFInk
#000000BG
rgba(255,255,255,1.0)Line
依赖极端对比与负空间的严格双色盘以产生视觉冲击。
03
字体
display-sans · humanist-sans
- display
170px · 500 - heading
60px · 300 - title
54px · 500 - body
28px · 500
频繁使用大写字母进行强调和导航 · 行高紧凑,营造更密集、野蛮主义的感觉 · 字重在轻体(300)与中等体(500)间交替,以创造强烈对比
04
间距
4px
8px
16px
24px
32px
48px
64px
96px
不对称且尺度较大,以容纳巨大排版
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 8px
lg · 12px
pill · 999px
使用锐利的 1px 白色边框来框定和分隔内容块
0px 0px 0px 1px rgba(255,255,255,1.0)
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
基于网格的结构,支持大型沉浸式图像与巨大排版块。
07
动效与交互
100msmicro
200mssmall
600msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
用于微妙显现的平滑透明度过渡 · 用于交互悬停状态的直接变换
即时的视觉反馈,通常通过透明度变化或细微变换实现。 · 直接响应,延迟极小。
08
组件
- button 极简、无边框或直角,依赖文字样式与悬停状态。
- card 带有粗体排版叠加层的高对比度图像容器。
- chip 带有大写样式的简单文字标签。
- input 由锐利边框定义的干净、极简输入框。
- hero 一个全屏、沉浸式的区域,由巨大、富有表现力的排版和高对比度图像主导。
09
文案语气与禁用清单
- 语气 粗犷、直接、自信。
- 标题风格 作为主要视觉元素的巨大、富有表现力的排版。
- 按钮文案 低调但清晰,通常融入整体排版布局。
- 不要使用色彩渐变——截图显示严格的黑白调色板
- 不要在文字上使用投影——截图显示扁平、高对比度的字体
- 不要将所有文字居中对齐——截图显示左对齐与表现性布局的混合
- 不要使用小巧、精致的排版——截图显示巨大、粗犷的展示字体
- 不要广泛使用圆角——截图显示锐利、几何元素
- 不要使用复杂、多栏的文字块——截图显示简洁、有冲击力的排版陈述
- 避免: 避免使用柔和的渐变或投影
- 避免: 避免使用许多小元素的拥挤布局
- 避免: 避免装饰性字体或俏皮插画
- 避免: 避免柔和的色彩盘或浅淡色调
- 避免: 避免传统的基于网格、统一的布局
- 避免: 避免使用超过两种字体族
10
包内真实截图
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
该网站是一个为设计工作室打造的、以排版为核心的大胆作品集。设计采用严格的单色盘,使用纯黑(#000000)和纯白(#FFFFFF)以实现最大对比度。排版是主要的设计元素,使用展示无衬线字体类别,尺度巨大(最大可达 170px),字距紧凑且字重交替。布局基于网格但刻意不对称,以营造野蛮主义、实验性的感觉。关键约束包括避免任何色彩使用、保持锐利的几何元素,以及保持布局简洁但富有冲击力。整体基调自信、直接且极具表现力,依靠尺度与对比而非装饰。
en · zh-CN · zh-TW · ja · ko