精选 · 开放 · 免费
Poppi
充满活力的、受流行艺术启发的DTC饮料品牌，使用大胆色彩和趣味几何图形。
beveragedtc
01
设计气质 DNA
趣味性充满活力健康导向复古现代平易近人
一家充满活力的、复古灵感的果汁吧与现代健康品牌的融合。
02
色彩
#EC008CAccent
#000000Ink
#FFF200BG
rgba(236, 0, 140, 1.0)Line
高对比度、高饱和度的调色板，以充满活力的黄色为基础，搭配鲜明的亮粉色点缀。
03
字体
grotesque-sans
- display
60px · 700 - h1
28px · 700 - body
16px · 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
包内真实截图
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
Poppi 是一个俏皮、面向消费者的饮料品牌，具有大胆、复古现代的美学。设计系统使用充满活力的黄色（#FFF200）作为主要背景色，并与鲜明的亮粉色（#EC008C）形成对比。字体排印主要依赖粗体的怪诞无衬线体（ITCAvantGarde），并以小写形式使用以保持友好、平易近人的语调。关键的设计规则是使用坚硬、实心的偏移盒阴影，而非柔和的发散阴影。避免使用正式语言、大写标题和尖锐的未圆角。整体感觉充满活力、受流行艺术启发且极其平易近人。
en · zh-CN · zh-TW · ja · ko