OpenDesign·你的设计资产库

网页参考

Cuberto

白色页面用居中大标题介绍设计开发服务,下方出现宽幅作品画面。

AgencyMotionInteraction
Cuberto 网站截图

理解与复用

从这份设计中借鉴什么

基于收录时的历史截图解读

设计亮点

  • 文字区域克制且留白充足
  • 作品画面成为第二个阅读停留点

适合什么项目

  • 设计工作室
  • 专业服务官网

如何带进你的设计

  • 用一句话概括服务,再用一个代表项目证明能力
  • 把项目说明放在画面之外保证阅读

使用边界

  • 截图中的作品素材不可直接移植为自己的案例
  • 仅依据已检查的历史预览;未核实现行网站、交互、精确 Tokens 或素材授权。

此解读由 Agent 编写,尚未经过人工终审;不代表原作者规范或使用授权。

01

设计气质 DNA

高端专业数字工艺大胆极简

一家高端设计与工程工作室,通过鲜明的对比和自信的排版进行表达。

02

色彩

#000000Ink
#FFFFFFBG
#161616BG quiet
#888888Muted
rgba(0,0,0,0.1)Line

严格的单色层次结构,使用鲜明的黑白对比,让高质量的摄影成为唯一的色彩来源。

03

字体

grotesque-sans

  • display81px · 400
  • heading23px · 400
  • body18px · 400
  • caption10px · 400

对大型展示文字使用紧凑字距(如 -1.62px),以营造坚实、建筑感的效果。 · 对小号文字使用宽松字距(如 0.468px),以保持高可读性。 · 字重主要限制在常规体(400),仅在需要强调时使用粗体(700)。

04

间距

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

非对称且宽敞,主要章节间使用大间距(如 90px),让内容得以呼吸。

05

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

sm · 18px
md · 18px
lg · 72px
pill · 99999px

仅用于交互元素和分隔线的最小 1px 实线边框。

无

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

带有全幅媒体和居中排版的大型主视觉区,随后过渡到双栏项目网格。

07

动效与交互

300msmicro
400mssmall
1200msmedium
cubic-bezier(0.16, 1, 0.3, 1)easing

用于页面转场和元素显现的流畅、基于物理效果的滑动。 · 用于交互提示的、持续旋转的圆形文字徽章。

在交互元素上进行细微的缩放或透明度变化,以提供反馈而不分散注意力。 · 带有细微动效的平滑、即时状态变化。

08

组件

  • button 胶囊形(圆角:99999px)按钮,通常带有纯黑或纯白背景和最小内边距。
  • card 项目卡片,配有大型、圆角(18px)的摄影缩略图和简洁的多行文字标签。
  • chip 用于持续、非侵入性行动号召的圆形旋转联系徽章。
  • input 极简文本输入框,可能为下划线或无边框样式,以匹配整体简洁美学。
  • hero 占据主导地位的全屏主视觉区,配有巨大的 81px 排版、单行副标题,以及一个深色、带圆角的媒体容器。

09

文案语气与禁用清单

  • 语气 自信、专业、含蓄。
  • 标题风格 简短、有力、具有描述性,聚焦核心价值主张。
  • 按钮文案 持续但不突兀,常利用旋转的圆形徽章。
  • 不要使用多种明亮的强调色 — 截图显示的是严格的单色调色板。
  • 不要使用装饰性或手写体字体 — 截图显示的是统一、干净的 grotesque-sans-serif。
  • 不要用许多小元素使 UI 杂乱 — 截图显示大量的负空间。
  • 不要所有元素都用尖角 — 截图显示一致使用圆角(18px 到胶囊形)。
  • 不要使用厚重的投影或 3D 效果 — 截图显示的是扁平、干净的表面。
  • 不要居中对齐所有文字 — 截图显示项目网格中标签为左对齐。
  • 避免: 营销术语
  • 避免: 过多的感叹号
  • 避免: 模糊或华丽的语言
  • 避免: 过于随意或俏皮的语气

10

包内真实截图

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

11

System Prompt

这是一个高端数字设计代理商作品集,以极端的极简主义和大胆的排版为特色。调色板严格单色,依赖于纯白(#FFFFFF)、实黑(#000000)和用于次要文字的浅灰(#888888)。排版采用干净的几何 grotesque-sans-serif 字体,既用于巨大的展示尺寸(81px),也用于小号的 UI 比例。布局宽敞,使用大间距和圆角(18px)来柔化鲜明的对比。关键禁忌:避免使用任何明亮的强调色,切勿使用装饰性或衬线字体,不要用过多的 UI 组件填满屏幕。整体保持高端、精致且具有建筑感的气质。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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