OpenDesign·你的设计资产库

网页参考

Buck

一个极简、高对比度的作品集,旨在让大尺寸的创意作品成为焦点。

StudioMotionCreative
Buck 网站截图

01

设计气质 DNA

创意全球工作室设计技术

一个高端创意代理作品集,展示大规模动态和品牌作品。

02

色彩

#F4C054Accent
#000000Ink
#FFFFFFBG
#F2F4F8BG soft
#9CA3AFMuted
rgba(226, 232, 240, 1)Line

在严格的黑白画布上实现极致简约,使用生动的项目图像作为唯一的色彩来源。

03

字体

geometric-sans · monospace

  • display50px · 100
  • body21px · 100

主字体(Mabry)专用于所有元素。 · 标题和正文均使用超细字重(100)。 · 项目分类常采用文本转大写的形式。

04

间距

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

不对称的,在项目缩略图周围使用大量宽松填充,并保持清晰的垂直流。

05

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

sm · 0px
md · 0px
lg · 0px
pill · 9999px

极细的 1px 实线边框,极少使用,主要用于结构分隔符或交互元素。

06

布局

1440container
12columns
24pxgutter
768 / 1024breakpoints

一个松散的、类似瀑布流的网格,不同尺寸的项目卡片之间具有宽间距。

07

动效与交互

200msmicro
300mssmall
750msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing

背景色变化时的平滑过渡。 · 项目卡片上细微的 hover 效果。 · 网格项在滚动时的交错显示。

项目缩略图上细微的背景色变化或轻微的透明度变化。 · 直接导航到项目案例研究,通常带有平滑的页面过渡。

08

组件

  • button 极简的文本式按钮,常为大写,依靠细字重实现优雅感。
  • card 一个干净的容器,包含一个全出血的大图像,后跟结构化的文本元数据(类别、标题、描述)。
  • chip 大写文本标签,用于分类作品,不使用传统的盒子或胶囊样式。
  • input 搜索功能可能使用一个极简的图标触发式输入框或全屏覆盖层。
  • hero 一个粗体、大尺寸的排版区块,以单行连续流的形式陈述公司的使命。

09

文案语气与禁用清单

  • 语气 专业、权威,但内敛。
  • 标题风格 超细字重的大尺寸无衬线字体,通过简洁传达自信。
  • 按钮文案 极简风格,依赖导航链接而非突出的行动号召按钮。
  • 不要为标题使用粗体字重——截图显示所有主要文本都使用超细字重(100)。
  • 不要为项目卡片添加阴影——截图显示完全平面、干净的表面。
  • 不要使用彩色背景——截图显示纯白色(#FFFFFF)画布。
  • 不要在容器上使用圆角——截图显示锐利的矩形缩略图。
  • 不要使用装饰性边框——截图显示通过留白和极细线条权重实现清晰分隔。
  • 不要使用复杂、多层的网格布局——截图显示相对简单的、交错的 2 列流。
  • 避免: 正文使用厚重、粗体字体。
  • 避免: 杂乱的布局或密集的段落。
  • 避免: 装饰性修饰或不必要的边框。

10

包内真实截图

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

11

System Prompt

BUCK 是一个全球创意代理作品集。其设计 DNA 是极致简约,使用纯白色(#FFFFFF)背景和黑色(#000000)文本,以确保生动的项目图像是焦点。排版是干净的几何无衬线字体(Mabry),始终以超细字重(100)使用,营造出精致、轻盈的感觉。关键颜色仅限于网站鲜明的黑白对比,偶尔使用单一暖金色(#F4C054)作为高光点缀。关键约束:不要为标题使用粗体字重,不要为卡片添加阴影或复杂边框,不要使用多列文本布局;始终优先考虑充足的留白,让作品自己说话。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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