精选 · 开放 · 免费
Spark
一款专注于AI驱动清晰度与平台一致性的现代邮件客户端。
productivityemail
01
设计气质 DNA
专注生产力智能AI跨平台
将杂乱的桌面整理成一个专注的单一工作空间。
02
色彩
#205EFFAccent
#111111Ink
#333333Ink soft
#FBFBFDBG
#F5F5F7BG soft
#F8F8FABG quiet
#6E6E6EMuted
rgba(175,175,175,1.0)Line
干净、通透的白色,搭配单一鲜明的蓝色操作色和高对比度文字。
03
字体
humanist-sans · system-sans
- display
56px · 800 - headline
32px · 700 - body
20px · 400 - small
14px · 400
粗体展示字体,紧凑字间距以增强冲击力 · 常规字重正文文本,确保最大可读性 · 几何人文主义主字体,配备系统回退字体
04
间距
4px
8px
12px
16px
24px
32px
40px
64px
8px基础单位,章节间留有充足内边距
05
表面 (圆角 / 阴影 / 边线)
sm · 6px
md · 16px
lg · 24px
pill · 999px
1px solid rgba(175,175,175,0.25)
0px 20px 40px 0px rgba(34,41,69,0.12) · 0px 7px 30px 0px rgba(160,165,209,0.2)
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
标准12列居中网格,配有充足留白
07
动效与交互
200msmicro
300mssmall
600msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
悬停时平滑的颜色过渡(0.3秒) · 状态变化时的透明度渐变 · 交互式卡片的细微上浮效果
平滑的背景色填充,过渡时间0.3秒;样机有轻微缩放 · 立即的颜色变化,伴随细微的阴影减弱
08
组件
- button 高对比度的实色主按钮,采用药丸形圆角;次级按钮为轮廓幽灵按钮
- card 柔和圆角卡片,在白色背景上带有细微的阴影深度
- chip 药丸形状态徽章,带有背景渐变(如AI标签)
- input 简洁的带边框输入框,带有细微的内阴影
- hero 分栏布局,左侧为大字号排版,右侧为浮动设备样机,背景为蓝色径向渐变
09
文案语气与禁用清单
- 语气 专业、自信且专注
- 标题风格 简短、有力、陈述性的句子,带句号
- 按钮文案 行动导向的动词(购买、下载、查看),置于高对比度按钮中
- 不要使用深色模式布局——截图显示主要为浅色(#FBFBFD)背景
- 不要使用衬线字体作为标题——截图显示为人文主义无衬线字体(Sofia-Pro)
- 不要使用多种相互竞争的点缀色——截图显示单一主导蓝色(#205EFF)
- 不要创建密集的信息架构——截图显示充足的留白和大边距(64px)
- 不要在卡片上使用尖锐的直角——截图显示圆角(16px至24px)
- 不要使用细体字重进行强调——截图显示标题使用粗体(800)
- 避免: 过度技术术语
- 避免: 激进的销售语言
- 避免: 视觉杂乱
- 避免: 低对比度文字
- 避免: 复杂的嵌套菜单
- 避免: 密集的文本块
10
包内真实截图
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
Spark是一款专注于生产力的邮件客户端,定位为现代专业人士的智能、专注解决方案。其设计DNA具有干净、通透的美学,以白色(#FBFBFD)为主导背景,并使用单一高饱和度蓝色点缀(#205EFF)作为主要操作色。排版依赖人文主义无衬线字体(Sofia-Pro)作为展示标题,字间距紧凑(-1.5px)且字重为800,正文字体则使用系统字体。布局采用充足留白(64px边距)和柔和圆角(16-24px半径)。关键禁忌:切勿将深色模式作为主要界面,切勿使用衬线字体作为展示类型,切勿用多种相互竞争的点缀色分散色彩系统。
en · zh-CN · zh-TW · ja · ko