OpenDesign·你的设计资产库

网页参考

Opx Studio

一个极简主义的创意机构作品集,具有大胆、黑白分明的排版标识。

StudioAgencyEditorialTypographyClean
Opx Studio 网站截图

01

设计气质 DNA

品牌设计工作室创意机构作品集

一家高端创意机构,通过大胆的排版和极简的呈现方式来展示设计专长。

02

色彩

#ffffffInk
#000000BG
#9b9b9bMuted
rgba(255,255,255,0.1)Line

高对比度、单色调色板,使用纯黑与纯白营造戏剧性视觉冲击,并以中性灰作为微妙的辅助元素。

03

字体

grotesque-sans · humanist-sans · monospace

  • display80px · 400
  • heading36px · 400
  • body18px · 400

展示型排版采用紧凑的字间距和较大的字号以产生视觉冲击力。 · 正文文本保持宽裕的行高以确保可读性。 · 字体粗细统一保持为400,以呈现干净、统一的外观。

04

间距

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

宽裕的留白,配合较大的内边距值(水平50px,垂直99px),在元素周围创造呼吸空间。

05

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

sm · 4px
md · 8px
lg · 12px
pill · 999px

极简的1px白色或深灰色边框,仅少量用于微妙的视觉分隔。

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

全宽主视觉区块,内容居中;过渡到以图像为主的项目网格,并保持宽裕的间距。

07

动效与交互

200msmicro
300mssmall
600msmedium
cubic-bezier(0.19, 1, 0.22, 1)easing

使用平滑的透明度与transform过渡来实现元素显现。 · 简单状态变化使用线性过渡。 · 更复杂的入场动画使用cubic-bezier缓动函数。

交互元素上的微妙透明度或颜色过渡。 · 通过状态变化提供即时的视觉反馈。

08

组件

  • button 极简的基于文本的按钮,内边距为(7px 30px),可能配有悬停过渡效果。
  • card 项目卡片,以大幅图像为特色,边框极简,依靠排版进行标注。
  • chip 在提供的截图中未见可见的标签组件。
  • input 在提供的截图中未见可见的输入字段。
  • hero 大幅、全视口的排版主视觉区域,粗体标题居中于黑色背景上。

09

文案语气与禁用清单

  • 语气 自信、专业、直接。
  • 标题风格 粗体、陈述性的标题,使用强有力的动词('发明'、'重振'、'变革')。
  • 按钮文案 极简而含蓄,可能是基于文本的,而非花哨的按钮。
  • 不要使用多种强调色——截图显示严格的单色黑白调色板。
  • 不要使用衬线字体——截图显示干净的无衬线展示字体和正文字体。
  • 不要创建杂乱的布局——截图显示宽裕的留白和极简的元素。
  • 不要使用装饰性边框或阴影——截图显示极简、干净的边缘。
  • 不要使用小的展示型排版——截图显示巨大、具有冲击力的标题字号(80px)。
  • 不要使用不一致的字体粗细——截图显示全文统一使用400粗细。
  • 避免: 避免使用过于技术性的术语。
  • 避免: 避免使用多个元素相互竞争的杂乱布局。
  • 避免: 避免使用明亮、饱和的色彩点缀。
  • 避免: 避免使用复杂的装饰元素或图案。
  • 避免: 避免使用小而拥挤的排版。
  • 避免: 避免使用不一致的间距或对齐方式。

10

包内真实截图

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

11

System Prompt

这是一个采用极简、高对比度黑白设计的创意机构/工作室作品集网站。其标识以大胆的排版和宽裕的留白为核心,以展示设计专长。关键色彩为纯黑(#000000)背景搭配白色(#ffffff)文本,并以中性灰(#9b9b9b)作为辅助元素。排版方面,展示型字体使用 grotesque-sans,正文字体使用 humanist-sans,粗细均为400。关键设计原则:保持高对比度、使用宽裕的间距、保持排版干净且具有冲击力。避免使用彩色点缀、杂乱布局、衬线字体、装饰元素、小号排版以及不一致的粗细。该设计依靠排版和摄影的力度,而非复杂的UI模式。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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