01
设计气质 DNA
俏皮创业漫画膨胀大胆
一张波普艺术风格的漫画页面
02
色彩
#000000Ink#F4EDDCBG#FFFFFFBG softrgba(0,0,0,1.0)Line高对比度的漫画书调色板,采用鲜明的黑色轮廓线和单一的柔和主色调。
03
字体
- display
80px · 400 - body
16px · 400
大标题使用漫画风格字体,正文则使用简洁的无衬线字体。
04
间距
4px8px16px24px32px48px64px96px4px基础网格
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 999px
2px solid black
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
大型居中的图形元素,文本直接覆盖在形状上。
07
动效与交互
220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1.0)easing
由气球图形和自定义光标暗示的膨胀/收缩效果。
交互元素使用自定义指针光标。 · 特定元素使用自定义小指针光标。
08
组件
- button 自定义光标指针(箭头、指针、小指针)替代标准按钮。
- card 包含文本的大型圆形气球形状。
- chip 无可见元素。
- input 无可见元素。
- hero 屏幕中央巨大的粉色气球图形,叠加漫画风格文本。
09
文案语气与禁用清单
- 语气 俏皮、充满活力且略带挑衅。
- 标题风格 漫画书风格,带有粗黑色轮廓和轻微阴影效果。
- 按钮文案 未明确展示,但暗示为大胆且具有交互性。
- 不要使用微妙的渐变——截图显示的是纯色填充。
- 不要使用衬线字体——截图显示的是漫画字体和无衬线字体。
- 不要使用深色背景——截图显示的是明亮、温暖的背景。
- 不要使用复杂的阴影——截图显示的是带有简单轮廓的扁平元素。
- 不要使用柔和的颜色——截图使用了鲜明的黑色和亮粉色。
- 不要使用标准UI组件——截图使用了自定义光标和图形形状。
- 避免: 衬线字体
- 避免: 微妙的渐变
- 避免: 企业术语
- 避免: 柔和的颜色
- 避免: 小号文本
10
包内真实截图
11
System Prompt
这是一个俏皮、受漫画启发的创业服务网站。设计采用鲜明的黑白色调,并以柔和的粉色为主调。字体方面,标题使用自定义漫画字体,正文则使用简洁的无衬线字体。关键交互包括自定义光标和膨胀主题。关键禁忌:不要使用衬线字体,不要创建微妙的渐变,不要使用深色背景,不要使用复杂的阴影,不要使用柔和的颜色,不要使用标准UI组件。




