精选 · 开放 · 免费
Ozero
一家展示大胆、多彩作品的全栈云设计工作室
StudioPortfolioBold TypographyCurationGallery
01
设计气质 DNA
创意极简实验性云端设计
一面展示多元客户作品的现代画廊墙
02
色彩
#1B1B1AInk
#FFFFFFBG
rgba(27,27,26,1.0)Line
高对比度的画廊美学，结合留白与大胆的项目图像
03
字体
humanist-sans
- display
106px · 400 - display
88px · 400 - heading
64px · 400 - body
16px · 400
font-size: 64px; line-height: 1.0; letter-spacing: -0.64px · font-size: 106px; line-height: 1.0; letter-spacing: -1.76px · font-family: Inter, Arial, sans-serif
04
间距
4px
8px
10px
12px
16px
20px
24px
32px
60px
64px
项目容器内使用充裕的内边距
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 999px
主要容器间无可见边框
06
布局
大型项目图像的非对称瀑布流网格
07
动效与交互
220msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
悬停时透明度淡入淡出 · transition: all 0.4s
交互元素的透明度变化 · 触发导航
08
组件
- button 头部中的纯文本导航链接
- card 大型全出血图像容器，偶尔带有文字叠加
- chip 无可见元素
- input 无可见元素
- hero 全视口瀑布流项目图像网格
09
文案语气与禁用清单
- 语气 极简且自信
- 标题风格 尺寸巨大、字距紧凑的展示型排版
- 按钮文案 简洁的、大写的文本链接
- 不要使用装饰性边框——截图显示的是干净、无边框的布局
- 不要在容器上使用投影——截图显示的是基于图像的扁平化构图
- 不要使用小型密集的网格——截图显示的是大型、开阔的项目图像
- 不要使用衬线字体——截图显示的是仅使用的无衬线字体 Inter
- 不要为整体页面使用柔和或粉彩背景——截图显示的是高对比度的黑白配色
- 不要使用标准卡片组件——截图显示的是全出血图像区域
- 避免: 冗长文案
- 避免: 装饰性修饰
- 避免: 复杂界面
10
包内真实截图
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
Ozero 是一个全栈云设计工作室网站，采用大胆的画廊风格作品集。布局为非对称瀑布流网格，展示大型全出血项目图像，搭配极简留白。主背景为白色 (#FFFFFF)，文字为黑色 (#1B1B1A)。导航是右上角对齐的简洁链接列表，使用大写无衬线字体。排版采用人文无衬线字体 (Inter)，以巨大的展示尺寸和紧凑字距呈现。关键设计元素包括桌面端的双栏布局、容器内的充裕内边距，以及干净无边框的界面。动效仅限于平滑的透明度过渡。关键注意事项：不要添加投影或装饰性边框，不要使用小型网格，不要使用衬线字体。该网站代表了一个专注于视觉作品的、高端极简主义创意作品集。
en · zh-CN · zh-TW · ja · ko