OpenDesign·你的设计资产库

网页参考

Oker

以单色色板、精致字体与大量留白为特征的极简设计工作室作品集。

StudioEditorialPortfolioCleanRefined
Oker 网站截图

01

设计气质 DNA

设计工作室极简创意作品集编辑设计

一座静谧精致的创意作品画廊,聚焦字体编排与大幅影像。

02

色彩

#FFFFFFInk
#A0A0A0Ink soft
#000000BG
#101010BG soft
#F5F5F5BG quiet
#808080Muted
rgba(160, 160, 160, 1.0)Line

基于严格单色体系,搭配黑白高对比模式以强化视觉焦点。

03

字体

transitional-serif

  • display80px · 400
  • title32px · 400
  • body16px · 400
  • caption16px · 300

04

间距

4px
8px
16px
24px
32px
48px
64px
96px

统一采用 8px 与 16px 增量进行内边距与对齐。

05

表面 (圆角 / 阴影 / 边线)

sm · 0px
md · 0px
lg · 0px
pill · 999px

使用 1px solid rgb(160, 160, 160) 作为细腻的水平分隔线。

06

布局

1280container
12columns
16pxgutter
768 / 1024breakpoints

以大量黑色或白色内边距分隔的全出血大幅影像。

07

动效与交互

200msmicro
300mssmall
600msmedium
cubic-bezier(0.645, 0.045, 0.355, 1)easing

悬停时平滑淡入与颜色过渡 · 图像展现时使用变换与透明度过渡

文字链接的颜色过渡与细微光标变化。 · 标准指针交互。

08

组件

  • button 简洁的文字链接配合颜色过渡,无可见按钮形状。
  • card 无传统卡片;内容以大型独立图片结合排版呈现。
  • chip 未观察到标签组件。
  • input 未观察到表单输入框。
  • hero 全视口大幅插图或摄影作品,常采用通栏布局。

09

文案语气与禁用清单

  • 语气 极简、专业、静谧。
  • 标题风格 大尺寸、细字重的过渡衬线体,常采用居中或左对齐排版。
  • 按钮文案 无按钮样式的纯文字链接。
  • 避免使用无衬线展示字体——截图显示所有标题均采用过渡衬线体。
  • 避免使用圆角按钮——截图显示为无按钮容器的纯文字链接。
  • 避免使用彩色点缀色板——截图显示为严格单色基础。
  • 避免使用厚重投影——截图显示为完全扁平的图像与字体编排。
  • 避免为文字使用复杂多栏网格——截图显示为宽裕的单栏留白。
  • 避免使用繁复装饰图案——截图显示为大面积洁净的摄影或插画区域。
  • 避免: 高饱和霓虹色
  • 避免: 厚重投影
  • 避免: 繁复装饰性背景
  • 避免: 圆角 UI 元素
  • 避免: 无衬线展示字体
  • 避免: 复杂渐变

10

包内真实截图

历史提取与模型分析 · 尚未逐项校验

11

System Prompt

Studio Oker 是一个极简设计工作室作品集,具有精致的编辑美学。设计基于严格单色体系,主要使用 #000000 与 #FFFFFF,辅以 #A0A0A0 和 #808080 用于次级文字与边框。字体采用过渡衬线体类别,字距紧凑(展示标题为 -1.6px)。布局以大量全出血影像为特征,通过宽裕的黑色或白色内边距分隔。关键约束包括:严格使用单色色彩,避免圆角 UI 元素或厚重阴影,保持大型字体与影像周围的充足留白。交互风格细腻,采用平滑透明度与颜色过渡,配合自定义 cubic-bezier 缓动函数。

把这份品味接进你的 Agent

把这套设计的机器可读规格——色彩、字体、动效,整套 DNA——直接交给你的 AI Agent。

OpenDesign 技能 ↗

复制给 Agent

参考链接与来源说明,可复制给 Agent。