精选 · 开放 · 免费
Boom Supersonic
一个大胆、以摄影为驱动的航空航天网站，通过戏剧性的深色叠加和精准的排版，展现超音速速度。
aerospace
01
设计气质 DNA
航空航天速度超音速工程创新
高性能航空航天工程与现代极简主义的融合。
02
色彩
#FFF555Accent
#FFFFFFInk
#000000BG
#88898AMuted
rgba(255, 255, 255, 0.2)Line
以高对比度的黑白为基础，单一的亮黄色仅用于极少量的强调点缀。
03
字体
geometric-sans
- display
72px · 700 - h1
48px · 500 - body
16px · 400 - caption
12px · 400
所有文本使用 Styrene A（或类似的几何无衬线字体） · 展示性尺寸采用紧凑的字间距和行高 · 小文本和标签使用宽松的字间距（1.2px）
04
间距
4px
8px
12px
16px
24px
32px
48px
64px
80px
96px
140px
采用充足的内边距，配合较大的垂直间距（96px，140px），在版块之间营造出戏剧性的呼吸空间。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 6px
lg · 8px
pill · 999px
0 4px 24px rgba(0, 0, 0, 0.3)
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
全出血摄影区域与结构化内容网格交替，功能亮点部分常采用双栏分割布局。
07
动效与交互
150msmicro
300mssmall
700msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
交互元素的平滑 hover 过渡效果（0.15秒） · 滚动触发显现的较长 transform 动画（0.7秒）
按钮和链接上微妙的背景或颜色过渡。 · 通过颜色变化提供即时视觉反馈。
08
组件
- button 主按钮“加入 Boom”，白色背景、黑色文字、尖锐边角（4px 圆角），hover 时带有深色边框。次要按钮使用透明背景搭配白色边框。
- card 图片为主的卡片，无可见边框，依靠摄影内容定义边界。
- chip 小型大写字母文本标签，用于导航或分类，采用宽松的字间距。
- input 极简输入框，仅有细微的底边框，无可见容器。
- hero 全视口摄影或视频背景，搭配深色叠加层（rgba(0,0,0,0.5)），居中的大号白色排版，以及滚动指示器。
09
文案语气与禁用清单
- 语气 自信、前瞻且技术精准。
- 标题风格 简短、有力的陈述，如“速度即超能力”，采用粗体大号排版。
- 按钮文案 直接且以行动为导向（例如“加入 Boom”）。
- 不要使用繁杂或拥挤的布局——截图显示元素间留有充足的留白和呼吸空间。
- 不要使用广泛的色彩范围——截图显示严格的白、黑、灰配色，仅搭配单一的黄色强调色。
- 不要在主按钮上使用圆角——截图显示最多 4px 圆角的尖锐边角。
- 不要使用小而拥挤的排版——截图显示采用紧凑字间距的大型粗体展示性文本。
- 不要使用复杂的背景图案——截图显示纯黑背景或全出血摄影。
- 不要使用过度装饰性的字体——截图显示仅使用干净的几何无衬线字体。
- 避免: 俏皮或随意的语言
- 避免: 过多的感叹号
- 避免: 缺乏上下文的过度专业术语解释
10
包内真实截图
桌面首屏（hero）
桌面滚动分段（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
Boom Supersonic 是一家专注于开发世界最快商用飞机的航空航天公司。网站采用高对比度配色方案，包括黑色（#000000）、白色（#FFFFFF）和灰色（#88898A），并以单一的亮黄色（#FFF555）作为强调。排版采用干净的几何无衬线字体（Styrene A），标题使用粗体、紧凑字间距的展示性尺寸，小型标签则使用更宽的字间距。关键特性包括带有深色叠加的全出血摄影背景、充足的内边距（96px 至 140px）以及极简的用户界面元素。关键禁忌：切勿使用繁杂布局、避免使用广泛的色彩范围、不要使用圆角按钮，并始终保持大而粗的排版风格。
en · zh-CN · zh-TW · ja · ko