01
设计气质 DNA
高端汽车性能优雅克制
一个高端汽车展厅，通过戏剧性的摄影展示高性能车辆。
02
色彩
#1C69D4Accent#414141Ink#ffffffBG#727171Mutedrgba(65, 65, 65, 0.2)Line极简配色，以深炭灰和纯白为主，并用单一的宝马蓝作为操作点缀色。
03
字体
- display
56px · 300 - headline
35px · 300 - body
18px · 300 - small
15px · 300 - caption
12px · 300
标题使用轻字重（300），营造优雅、高端的感觉。 · 按钮文字使用中等字重（500），以清晰强调操作引导。 · 大尺寸展示文字采用紧凑的负字距，增强视觉密度。 · 正文保持充裕的行高（1.5-1.6），确保阅读舒适。
04
间距
4px8px12px16px24px32px48px64px96px8px 网格系统，配合充裕的水平内边距（桌面端主视觉区域为96px），确保呼吸感。
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 2px
lg · 5px
pill · 999px
使用柔和的炭灰色（#414141）细边框（1px），用于微妙分隔，避免厚重轮廓。
rgba(0, 0, 0, 0.25) 0px 4px 4px 0px · rgba(0, 0, 0, 0.2) 0px 0px 18px 0px
06
布局
1440container
12columns
24pxgutter
768 / 1024breakpoints
全出血主视觉图像搭配左对齐文字覆盖层，下方过渡到居中的白色内容区块。
07
动效与交互
100msmicro
200mssmall
500msmedium
cubic-bezier(0.455, 0.03, 0.515, 0.955)easing
交互元素进行快速的 0.1s 颜色过渡，提供即时反馈。 · 内容揭示使用平滑的 0.5s 透明度淡入。 · 可展开导航元素使用细微的宽度和位置过渡。
文字链接和按钮颜色立即变化，图像上的透明度发生微妙偏移。 · 状态切换干净，无厚重缩放或变形效果。
08
组件
- button 实心蓝色（#1C69D4）填充按钮，白色文字，直角；次要操作使用幽灵/描边变体。
- card 以图像为主的编辑式卡片，装饰极少，聚焦高质量汽车摄影。
- chip 简洁的文字导航标签，带下划线指示器，不使用胶囊形容器。
- input 干净极简的输入框，带细底边框，符合克制的设计语言。
- hero 全视口摄影背景，搭配渐变叠加层，确保深色图像上的文字可读性。
09
文案语气与禁用清单
- 语气 自信、高端且信息丰富，不强加于人。
- 标题风格 全大写展示字体，声明式语句后使用句号（例如：'租赁 2026款 BMW X5 xDRIVE40i。'）。
- 按钮文案 蓝色按钮上的直接动词（'了解更多'、'优惠详情'、'查看所有优惠'），采用句首大写。
- 不要在主要按钮上使用圆角——截图显示为0-2px的直角
- 不要添加装饰性渐变或图案——截图显示为带有深色叠加的平面摄影主视觉
- 不要使用粗体/重字重排版——截图显示标题主要使用轻字重（300）
- 不要引入多种点缀色——截图显示仅使用宝马蓝（#1C69D4）作为唯一的彩色点缀
- 不要创建杂乱的多列主视觉布局——截图显示为单一全出血图像搭配左对齐文字
- 不要在内容卡片上使用投影——截图显示为平面、干净的表面，无分层立体效果
- 避免: 过多感叹号
- 避免: 随意俚语
- 避免: 过于技术化的行话
- 避免: 杂乱的文字布局
10
包内真实截图
11
System Prompt
BMW.com 是一个高端汽车品牌网站，以戏剧性的全视口摄影为特色，搭配克制、优雅的排版。设计采用轻量的 grotesque-sans 字体（bmwTypeNextWeb），标题主要使用轻字重（300），营造奢华感。配色极简：白色（#FFFFFF）背景、炭灰色（#414141），以及单一的宝马蓝点缀色（#1C69D4）用于操作引导。关键十六进制颜色包括蓝色点缀、白色背景和深色覆盖用的炭灰色（#262626）。主视觉区域使用全出血汽车摄影，搭配渐变叠加层以确保文字可读性。关键禁忌：永远不要使用圆角按钮（保持直角/方形），永远不要添加多种点缀色（蓝色是唯一的彩色元素），永远不要在标题中使用重字重（始终使用轻/300）。布局从戏剧性的深色摄影主视觉过渡到干净的白色内容区块。导航极简，采用简洁的水平链接和下拉箭头。