精选 · 开放 · 免费
Wakawaka
一个精致的设计工作室作品集,以大胆、雕塑感的排版展示功能性木制器物。
PremiumStudioPhotographicBold TypographyClean
01
设计气质 DNA
家具工作室极简工艺目录
一本极简主义画廊展览目录。
02
色彩
#28282AInk
#EDEAE4BG
#D4D1CBBG soft
#C9C7C4Muted
rgba(40,40,42,1.0)Line
高对比度、极简主义调色板,聚焦于让排版与摄影成为视觉中心。
03
字体
grotesque-sans
- display
560px · 500 - body
14px · 400
导航与元数据使用大写小型大写字母 · 小型大写文本采用宽松字间距 · 巨型展示文本采用极端负字间距
04
间距
4px
8px
16px
20px
24px
32px
48px
96px
宽松的垂直间距搭配极少的水平内边距,允许排版延伸至边缘。
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 50px
无;依赖形状与间距实现分隔。
06
布局
1440container
12columns
20pxgutter
768 / 1024breakpoints
全出血垂直堆叠,超大排版主导视口。
07
动效与交互
220msmicro
400mssmall
800msmedium
cubic-bezier(0.445, 0.05, 0.55, 0.95)easing
hover 状态下细微的透明度与变换过渡。
细微的缩放或透明度变化。 · 即时响应,无弹跳效果。
08
组件
- button 无可见组件。
- card 无可见组件。
- chip 无可见组件。
- input 无可见组件。
- hero 巨型排版标志搭配全幅摄影研究。
09
文案语气与禁用清单
- 语气 极简、安静且自信。
- 标题风格 单字、巨型、雕塑感。
- 按钮文案 无可见组件。
- 勿使用白色背景——截图显示为米白色(#EDEAE4)背景。
- 勿为元素添加投影——截图显示为完全扁平的无阴影设计。
- 勿使用小而紧凑的展示字体——截图显示为巨大、开阔的排版。
- 勿在主标题文本上使用宽字间距——截图显示为极端负字间距。
- 勿使用彩色强调色——截图显示为严格的单色板,无明亮强调色。
- 勿在布局元素上使用圆角——截图显示为锋利、无圆角的边缘。
- 避免: 杂乱
- 避免: 过度装饰
- 避免: 复杂导航
10
包内真实截图
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
为洛杉矶家具制造商 'Waka Waka' 设计的极简主义设计工作室作品集。视觉标识依赖巨大、超紧凑的 grotesque-sans 字体,延伸至屏幕边缘,营造雕塑效果。色彩搭配严格克制:米白色背景(#EDEAE4)、深炭黑墨色(#28282A)以及用于纹理的柔和灰色(#C9C7C4)。摄影处理带有柔和的颗粒质感。关键禁忌:切勿在布局元素上使用圆角,切勿添加投影,切勿在标题上使用宽字间距。设计精髓在于巨大尺度的文本与周围安静、空旷空间之间的张力。
en · zh-CN · zh-TW · ja · ko