精选 · 开放 · 免费
Moderne St
为创意团队提供高度定制化广告创意与洞察的数字工作空间。
Creative ToolsEditorialBold TypographyProductivityCalm
01
设计气质 DNA
创意工作空间广告创意头脑风暴洞察
一个充满活力、插画风格的广告团队创意工作室。
02
色彩
#FF7E85Accent
#3E3C43Ink
#7C7AADInk soft
#F3EAE5BG
#171C5DBG quiet
#7A7780Muted
rgba(124, 128, 173, 1.0)Line
温暖的米白色背景，与深靛蓝色区域和明亮的珊瑚色点缀形成对比。
03
字体
humanist-sans · transitional-serif
- display
56px · 500 - body
16px · 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
包内真实截图
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
一个为创意团队提供广告创意与洞察的 SaaS 工具。配色方案包含温暖的米白色背景 (#F3EAE5)、深靛蓝色区域 (#171C5D) 和明亮的珊瑚色点缀 (#FF7E85)。字体方面，大号展示文本使用 humanist sans-serif，正文使用 transitional serif。关键注意事项包括：不要使用纯白色背景；不要在深色区域使用亮色主色；不要使用亮红色作为强调色。设计上依赖粗体、大号的字体以及色彩丰富、带有纹理的插画。
en · zh-CN · zh-TW · ja · ko