OpenDesign·你的设计资产库

网页参考

Poppi

充满活力的、受流行艺术启发的DTC饮料品牌,使用大胆色彩和趣味几何图形。

BeverageDtc

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

01

设计气质 DNA

趣味性充满活力健康导向复古现代平易近人

一家充满活力的、复古灵感的果汁吧与现代健康品牌的融合。

02

色彩

#EC008CAccent
#000000Ink
#FFF200BG
rgba(236, 0, 140, 1.0)Line

高对比度、高饱和度的调色板,以充满活力的黄色为基础,搭配鲜明的亮粉色点缀。

03

字体

grotesque-sans

  • display60px · 700
  • h128px · 700
  • body16px · 400

使用小写文本转换以营造随意、友好的语调。 · 对展示尺寸应用紧凑的负字间距以增强冲击力。 · 保持文字与鲜艳背景色之间的高对比度。

04

间距

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

灵活的内边距,通常为16px或32px,主要版块间有更大的垂直间距。

05

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

sm · 10px
md · 20px
lg · 40px
pill · 9999px

2px solid rgb(229, 231, 235),常用于输入框和卡片。

None: None · None: None · None: None

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

此模态视图采用标准的居中单栏布局。

07

动效与交互

250msmicro
400mssmall
800msmedium
cubic-bezier(0.42, 0, 0.58, 1)easing

为背景色、颜色和盒阴影提供平滑过渡。 · 使用透明度渐变控制元素可见性。

背景色或盒阴影的微妙变化,通常带有过渡效果。 · 即时视觉反馈,可能通过颜色偏移或变换实现。

08

组件

  • button 宽大的药丸形按钮,采用纯色背景(例如粉色)和白色文字。
  • card 组件通常具有纯色、明亮的背景色和圆角。
  • chip 在分析的截图中未突出显示。
  • input 标准圆角输入框,具有纯色背景和细微边框。
  • hero 全幅、充满活力的渐变背景,搭配大号字体排印和突出的产品图像。

09

文案语气与禁用清单

  • 语气 俏皮、热情且对话式。
  • 标题风格 粗体、小写且有力,常使用品牌特有的复古字体。
  • 按钮文案 直接、友好且以行动为导向(例如 '保持联系')。
  • 不要使用柔和、低饱和度的颜色——截图显示的是充满活力、高饱和度的黄色和粉色。
  • 不要在标题中使用大写字母——截图显示的是全小写排版。
  • 不要为主要组件使用尖锐的矩形角——截图显示的是大圆角边框半径(10px 到 9999px)。
  • 不要使用微妙、发散的阴影——截图显示的是坚硬、实心的偏移阴影(5px 5px 0px)。
  • 不要使用深色模式——截图显示的是明亮、以浅色模式为主的调色板。
  • 不要为此类专注的模态窗口使用复杂的网格布局——截图显示的是居中的单栏布局。
  • 避免: 正式语言
  • 避免: 复杂术语
  • 避免: 过于严肃的语调

10

包内真实截图

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

11

System Prompt

Poppi 是一个俏皮、面向消费者的饮料品牌,具有大胆、复古现代的美学。设计系统使用充满活力的黄色(#FFF200)作为主要背景色,并与鲜明的亮粉色(#EC008C)形成对比。字体排印主要依赖粗体的怪诞无衬线体(ITCAvantGarde),并以小写形式使用以保持友好、平易近人的语调。关键的设计规则是使用坚硬、实心的偏移盒阴影,而非柔和的发散阴影。避免使用正式语言、大写标题和尖锐的未圆角。整体感觉充满活力、受流行艺术启发且极其平易近人。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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