OpenDesign·你的设计资产库

网页参考

Moderne St

为创意团队提供高度定制化广告创意与洞察的数字工作空间。

Creative ToolsEditorialBold TypographyProductivityCalm
Moderne St 网站截图

01

设计气质 DNA

创意工作空间广告创意头脑风暴洞察

一个充满活力、插画风格的广告团队创意工作室。

02

色彩

#FF7E85Accent
#3E3C43Ink
#7C7AADInk soft
#F3EAE5BG
#171C5DBG quiet
#7A7780Muted
rgba(124, 128, 173, 1.0)Line

温暖的米白色背景,与深靛蓝色区域和明亮的珊瑚色点缀形成对比。

03

字体

humanist-sans · transitional-serif

  • display56px · 500
  • body16px · 400

使用 humanist sans-serif 字体以呈现有冲击力的大号展示文本。 · 使用 transitional serif 字体作为正文和详细说明的文本。 · 在大号展示文本与标准正文之间保持清晰的排版层次。

04

间距

4px
8px
12px
16px
20px
24px
32px
40px
48px
55px
64px
96px
140px

充裕的垂直间距,使用大号的内边距块来分隔不同的内容区域。

05

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

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

用于轮廓卡片和按钮的细 2px 边框。

06

布局

1280container
12columns
32pxgutter
768 / 1024breakpoints

标准响应式布局,包含一个突出的主视觉区域,随后是内容块。

07

动效与交互

150msmicro
300mssmall
500msmedium
cubic-bezier(0.25, 0.1, 0.25, 1.0)easing

UI 元素(如按钮和颜色变化)的快速 0.15 秒过渡。

交互元素上快速的 0.15 秒颜色过渡。 · 对点击做出即时响应。

08

组件

  • button 珊瑚色填充按钮,白色文字,并有一个药丸形状的“获取演示”变体。
  • card 带有细边框和圆角的卡片,内含文本或插画。
  • hero 一个分屏式主视觉:左侧为深色背景上的大号文本,右侧为色彩丰富的插画。

09

文案语气与禁用清单

  • 语气 专业、鼓舞人心,并带有一丝俏皮。
  • 标题风格 大号、有冲击力,并聚焦于创意赋能。
  • 按钮文案 直接且以行动为导向,例如“立即开始”。
  • 不要使用纯白色背景——截图显示内容区域使用了温暖的米白色 (#F3EAE5)。
  • 不要在深色区域使用亮色主色——截图显示使用了深靛蓝色 (#171C5D)。
  • 不要使用亮红色作为强调色——截图显示使用了柔和的珊瑚色 (#FF7E85)。
  • 不要在正文中使用纯几何无衬线字体——截图显示使用了 transitional serif 字体。
  • 不要为 UI 元素使用过度圆角的边框——截图显示使用了细微的 4px 圆角。
  • 不要为卡片元素使用投影——截图显示使用的是带细边框的扁平化设计。
  • 避免: 充斥行话的语言
  • 避免: 枯燥、过于企业化的语调

10

包内真实截图

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

11

System Prompt

一个为创意团队提供广告创意与洞察的 SaaS 工具。配色方案包含温暖的米白色背景 (#F3EAE5)、深靛蓝色区域 (#171C5D) 和明亮的珊瑚色点缀 (#FF7E85)。字体方面,大号展示文本使用 humanist sans-serif,正文使用 transitional serif。关键注意事项包括:不要使用纯白色背景;不要在深色区域使用亮色主色;不要使用亮红色作为强调色。设计上依赖粗体、大号的字体以及色彩丰富、带有纹理的插画。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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