精选 · 开放 · 免费
Jam3
通过创意与科技改变品牌的全球数字创意机构。
agencycreative
01
设计气质 DNA
全球数字创意机构
一家高端全球数字创意机构
02
色彩
#3C0C60Accent
#2D2D2DInk
#5A5A5AInk soft
#EAE8E4BG soft
#F5F5F5BG quiet
#DEDFE5Muted
rgba(234,232,228,0.3)Line
基于深/浅模式的高对比度排版，搭配单一深紫色点缀。
03
字体
grotesque-sans
- display
67px · 800 - headline
48px · 800 - title
23px · 500 - body
15px · 400 - caption
10px · 400
04
间距
4px
8px
16px
24px
32px
48px
64px
96px
灵活间距，配以充裕的水平内边距和板块间清晰的垂直分隔。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 20px
lg · 70px
pill · 100px
1px solid rgba(234,232,228,0.4)
0px 20px 40px -16px rgba(0,0,0,0.3) · 0px 30px 30px -16px rgba(0,0,0,0.3)
06
布局
1440container
12columns
24pxgutter
768 / 1024breakpoints
全宽摄影英雄区域，配有居中内容叠加层和用于编辑卡片的结构化网格。
07
动效与交互
200msmicro
300mssmall
600msmedium
cubic-bezier(0.19, 1, 0.22, 1)easing
透明度淡入 · 流畅的 box-shadow 过渡 · 使用 max-height 的布局偏移
卡片的细微透明度变化与 box-shadow 扩展。 · 流畅的滚动或导航过渡。
08
组件
- button 药丸形按钮，采用纯色边框或背景。
- card 简洁的编辑式卡片，包含大尺寸图像与结构化排版。
- chip 圆角药丸形徽章。
- input 带下划线的文本输入框。
- hero 全出血摄影英雄区，叠加巨大粗体排版。
09
文案语气与禁用清单
- 语气 自信、权威且富有创新精神。
- 标题风格 大胆、有力，采用小写或句首大写。
- 按钮文案 直接且行动导向，搭配药丸形按钮。
- 避免使用衬线字体——截图显示的是粗体几何 grotesque-sans 字体。
- 避免使用明亮霓虹背景——截图显示深暗色调与浅中性灰。
- 避免到处使用尖锐的直角——截图显示频繁使用全圆角药丸形状。
- 避免使用纤细、精致的字体——截图显示所有标题均采用粗重字重。
- 避免使用杂乱的导航——截图显示简洁的顶部导航栏。
- 避免使用多色按钮——截图显示大多为单色或白色/描边按钮。
- 避免: 泛泛的商务用语
- 避免: 杂乱的界面
- 避免: 空洞的形容词
- 避免: 过于复杂的导航
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 步进，作为视觉证据）
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
Jam3 是一家全球数字创意机构。设计采用高端、高对比度的调色板，包含深炭色、浅灰色和标志性的深紫色点缀。排版依赖粗体几何 grotesque-sans 以增强冲击力。英雄区域使用全出血摄影。关键禁忌：不要使用衬线字体，不要所有元素都用尖角，标题不要使用细字重。界面必须感觉大胆、简洁且专业。
en · zh-CN · zh-TW · ja · ko