OpenDesign·你的设计资产库

网页参考

Dezeen

一个干净的、以图像为主导的建筑与设计编辑平台，带有标志性的蓝色点缀。

EditorialArchitecture

封面待补录，可通过原站查看设计。

01

设计气质 DNA

建筑设计杂志策展摄影

一本高端设计杂志的网络版，优先考虑大幅编辑摄影和干净的排版。

02

色彩

#556e9bAccent
#000000Ink
#ffffffBG
#f0f0f0BG soft
#757575Muted
rgba(85, 110, 155, 1)Line

以高对比度的黑白为基础，配以标志性的灰蓝色点缀。

03

字体

humanist-sans · transitional-serif

  • display56px · 700
  • h140px · 700
  • body18px · 400
  • small14px · 700

标题和导航使用无衬线字体。 · 文章正文使用衬线字体。 · 字重 700 重度用于强调和导航。 · 大型展示文字保持紧凑的字间距。

04

间距

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

充足的留白分隔编辑区块。

05

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

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

清晰的 3px 边框作为区域分隔线。

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

严格的网格，左侧主栏用于文章，右侧次栏用于辅助内容。

07

动效与交互

200msmicro
400mssmall
800msmedium
ease-in-outeasing

背景和颜色变化的平滑过渡。

交互元素的背景颜色变化。 · 即时响应。

08

组件

  • button 极简，基于文本或实心色块，带有尖锐的边角。
  • card 以图片为主的区块，叠加文字并带有清晰的边框。
  • chip 简单的文本标签，使用粗体字重。
  • input 干净的矩形输入框，带有细边框。
  • hero 大型摄影图像，叠加文字。

09

文案语气与禁用清单

  • 语气 权威、精致且干净。
  • 标题风格 简短、描述性强且有冲击力。
  • 按钮文案 低调且直接。
  • 不要在卡片上使用圆角——截图显示是清晰的 0px 边框。
  • 不要使用多彩的点缀色板——截图由黑、白和单一的灰蓝色 (#556e9b) 主导。
  • 不要为长篇文本使用无衬线字体——截图在文章正文中使用了衬线字体。
  • 不要给容器添加投影——截图显示是平面效果。
  • 不要使用复杂的布局——截图使用了严格、干净的网格。
  • 不要使用活泼的排版——截图依赖于高对比度、严肃的字重。
  • 避免: 俚语
  • 避免: 过于随意的语言
  • 避免: 装饰性字体

10

包内真实截图

Dezeen — 桌面首屏（hero）
桌面首屏（hero）
Dezeen — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Dezeen — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Dezeen — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Dezeen — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Dezeen — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Dezeen — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Dezeen — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Dezeen — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Dezeen — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Dezeen — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Dezeen — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Dezeen — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Dezeen — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Dezeen — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Dezeen — 移动首屏
移动首屏

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

11

System Prompt

Dezeen 是一个高端的建筑与设计编辑平台。其设计 DNA 建立在高对比度的黑白调色板和标志性的灰蓝色 (#556e9b) 点缀之上。排版使用人文主义无衬线字体作为标题，过渡衬线字体作为正文，保持精致而权威的语调。关键规则：使用清晰的 0px 边框，避免圆角，并保持严格的编辑网格。永远不要使用活泼或装饰性的元素；其美学是干净、策展和摄影驱动的。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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