品牌色

按产品系列选择配色方案，目前覆盖汽车清洁养护、智能车载设备、收纳与装饰配件、维修保养工具、机车/自行车配件等系列。每个系列包含适配不同产品和视觉方向的配色，点击色卡可复制色号；中性色与功能色共用统一规范，保证不同产品页面的阅读层级一致。

中性色

中性色主要用于文字、图标、边框、分割线及页面背景，通过不同深浅区分信息层级与界面结构。各品牌配色共用同一套中性色，不随品牌色切换而变化，确保不同主题下的内容清晰易读，界面层次保持一致。

功能色

功能色用于传达成功、警告、错误和提示等状态，帮助用户快速识别信息并作出判断。各品牌配色共用同一套功能色，不随品牌色切换而变化，确保同一状态在不同主题下具有一致的含义。使用时应搭配文字或图标，避免仅靠颜色区分状态。

灵活性 / 临时性配色

为兼顾视觉一致性与设计灵活性，页面配色应以既定色彩规范为主。特殊场景下，设计师可根据实际需求适度调整或补充配色，
但规范外配色的使用面积不应超过页面整体配色面积的 5%，且不得影响信息识别与功能色含义。

图标尺寸

工具图标采用 48 × 48px 画布，核心图形置于 40 × 40px 安全区域内，四周各保留 4px 留白。

图标风格

30 枚汽车用品图标，涵盖清洁养护、车载设备、汽车吸尘与充电、维修工具及轮胎修补。默认保留上传文件的灰蓝双色，可调整颜色与粗细，按产品卖点选用。点击卡片底部的复制或下载按钮，获取当前样式的 SVG 矢量文件。

未找到匹配图标，请尝试其他中文或英文关键词。

SVG 矢量格式 · 保留上传文件的原始 viewBox、颜色结构和文件名 · 粗细调整按原始线宽比例缩放 · 重置可恢复上传样式

设计规则

统一图标的绘制方式、视觉节奏与使用边界，确保不同场景下的图标清晰易辨，并保持品牌视觉的一致性。

字体包下载

下载品类设计所需字体，按对应方案使用规定字重，保持同一产品及系列素材的字体一致性。每个字体包包含字体文件与授权说明。

文案字体层级

按标题、正文和辅助信息划分七类层级，分别规定字体、字号、字重与行高，同一产品及系列素材应统一使用。

数字字体层级

数字统一使用 Inter，以清晰、稳定的字形呈现价格、数量与产品参数。按信息重要性划分为重点数字、次级数字和常规数字三级，通过字号与字重建立层次；同类数据保持格式和对齐方式一致。

表达规范

围绕步骤、安装连接、尺寸适配与操作展示四种表达方式，帮助用户判断如何使用及是否适用。

表达规范

围绕产品利益、真实使用场景和问题解决选择首图。首屏聚焦一个购买理由，准确呈现实物、包装及必要规格。

表达规范

按污渍与使用痕迹、收纳与操作不便、途中使用需求选择情境。仅呈现商品已确认能改善的问题。

表达规范

按对比、过程和实测组织证据。保持对象、角度、光线和测量口径可比较，不修饰差异或外推单次结果。

表达规范

围绕作用对象、设备结构、安装与受力关系选择表达方式；示意图需标明，避免虚构结构或技术特效。

表达规范

将适用范围、限制条件和对应证据放在可读位置；图标、儿童宠物场景和认证标志不能替代资料。

表达规范

按多部位用途、套装清单和真实场景组织内容，突出具体差异与使用边界。

表达规范

分别说明评价来源、数据口径与服务条件；动态信息以平台或店铺当前数据为准。

产品案例

对照产品定位与卖点逻辑，查看整页视觉和重点参考内容。转化表现按上线前后三天对比，销售额保留原始记录口径。

品牌参考

结合参考产品类型查看品牌视觉做法，选择与产品定位和卖点相符的设计方法；可访问对应网站了解完整案例。

文案原则

围绕用户需要表达关键信息，保持用词准确、结构清晰和语气一致，让内容易于理解与执行。

字数应用

通过字号、字重、颜色和留白建立稳定层级，不要仅靠放大字号制造重点。英文文案按以下单词数量控制长度。

对齐与布局

文字对齐应服务于浏览路径。正文通常左对齐；数值可右对齐；避免无规则的混合对齐。

链接文案应描述目标内容，避免使用“点击这里”等无意义表达。

专名大小写

英文标题采用统一的大小写策略；品牌、产品和技术名词按官方写法呈现。

字体颜色

文本颜色与背景颜色过于接近时会影响阅读，浅色与深色背景均需保持清晰的文字层级。下表展示不同文字角色的颜色与透明度参考；实际使用时，应根据最终叠加后的文字和背景颜色检查对比度，不将透明度数值直接视为达标结论。

注：表格中 @Black = #000000，@White = #FFFFFF，@Green-6 = #134048。示例色值用于展示规范内容；低对比度组合不应直接用于正文或链接。

选图原则

以产品真实、车型适配、场景可信为基础，兼顾材质、光线与系列一致性。

1. 01

   场景适配

   按品类选择真实车厢、洗车位、道路或维修工位，让使用环境与产品用途相符。

2. 02

   产品准确

   还原实物外观、包装、接口、尺寸与配件，不随意改色、变形或添加不存在的功能。

3. 03

   车型适配

   清晰呈现安装位置、适用部位和产品比例；涉及车型或尺寸时，避免造成通用适配的误解。

4. 04

   材质可信

   真实表现皮革、塑料、金属、玻璃、橡胶等车用材质，保留自然纹理与反光细节。

5. 05

   光线有层次

   控制高光、暗部与氛围光，确保产品轮廓和表面细节可辨；避免过曝、死黑和过度光效。

6. 06

   主体突出

   让产品与核心卖点一眼可见，车辆、人物和道具作为场景支撑，不遮挡主体或喧宾夺主。

7. 07

   操作可信

   展示符合实际且安全的握持、安装、清洁或维修步骤；前后效果对比保持角度和条件一致。

8. 08

   品牌视觉一致

   同系列统一色调、构图、留白与品牌配色；避免混入其他品牌标识或未经证实的功效宣传。

选图推荐

根据品牌定位与产品特性，选择适合的色调、光线和场景氛围。同一产品系列保持一致的视觉方向，让图片与品牌配色自然协调。

选图对错示例

场景特征：生活温度、材质还原、光影层次、场景比例、空间关系。每一组左侧为禁止示例，右侧为推荐示例。

01

光效效果

审图要点：控制光效亮度与色彩，突出产品；避免发光过度或色偏。

禁止

推荐

02

比例

审图要点：产品与人物、环境比例协调；避免产品过大或透视失真。

禁止

推荐

03

光感

审图要点：曝光适当，明暗有层次；避免暗沉、过曝或主体细节丢失。

禁止

推荐

04

画面秩序

审图要点：主体与工具层级清晰，画面整洁；避免背景杂乱、主体不突出。

禁止

推荐

05

质感

审图要点：材质纹理清晰、反光自然；避免质感失真或细节模糊。

禁止

推荐

06

真实应用

审图要点：呈现真实产品用法与操作场景；确保动作、产品和使用对象关系清楚。

禁止

推荐

07

功效

审图要点：围绕产品核心功能呈现真实、可辨的使用效果；避免夸张光效或失真的效果对比。

禁止

推荐

08

呼吸感

审图要点：主体突出、画面疏密有致，为产品和卖点留出空间；避免车内杂物堆叠、画面拥挤。

禁止

推荐

先明确产品调性（AI约束的前提）

家居清洁产品独立站通常有以下几种调性，不同调性对应的 AI 约束各有侧重。

AI约束第一步：锁定 1 个核心调性，其余全部排除。

品牌设计规范的核心维度（AI需遵守）

围绕车品使用场景，统一产品与车身/内饰基调、材质表现、环境构图和光线，让产品真实清晰、风格协调、卖点可信。

color palette: automotive neutrals, graphite black, metallic silver, clean white, restrained brand-color accents, realistic paint and interior colors, consistent color grading

neon colors, oversaturated palette, rainbow gradients, unnatural color cast, inconsistent vehicle paint, altered product colors

materials: realistic automotive paint and clear coat, brushed metal trim, leather, glass, rubber, textured plastic, microfiber, natural surface reflections, crisp material detail

fake chrome, waxy plastic, excessive gloss, smeared texture, material mismatch, warped surfaces, artificial scratches

scene: suitable automotive exterior, clean car interior, wheel and tire area, glass surface, or professional detailing bay; composition: clear product hero, believable product-to-vehicle interaction, authentic scale, tidy supporting tools, balanced negative space

unrelated home scene, cluttered garage, floating product, incorrect application, distorted vehicle proportions, obscured product, excessive props

lighting: soft natural daylight or controlled studio light, balanced exposure, neutral white balance, realistic highlights on automotive paint, visible shadow detail, refined commercial photography

blown highlights, crushed blacks, harsh direct flash, neon color cast, fake light beams, unrealistic reflections, heavy vignette

AI约束规则模板（可直接复制使用）

替换模板中的车品类型、产品调性、主辅色与适用场景，并组合对应维度约束，生成真实可信、风格统一的车品视觉素材。

[车品类型] automotive product photography, [品牌调性] visual style,
faithful product shape, packaging and colors based on the reference,
color palette: [主色], [辅色], automotive black, gray, silver, white, restrained brand accents, consistent color grading,
materials: realistic automotive paint, clear coat, glass, leather, rubber, metal, microfiber, select materials relevant to the product,
scene: [车身外观/车内座舱/轮毂轮胎/专业施工环境], matched to the product use,
composition: product as clear focal point, believable interaction with the vehicle or target surface, realistic scale, tidy props, clean negative space,
lighting: soft natural daylight or controlled studio light, neutral white balance, balanced reflections and shadow detail,
style: [品牌视觉调性], precise, polished, realistic commercial photography, high detail

neon colors, oversaturated palette, rainbow gradients, unnatural color cast, inconsistent vehicle paint or product colors,
fake chrome, waxy plastic, excessive retouching, unrealistic surface reflections,
incorrect product use, floating product, distorted vehicle proportions, cluttered workshop, unrelated setting,
blown highlights, crushed blacks, harsh flash, fake light beams,
garbled text, invented logo, watermark, altered product label,
obscured product, excessive props, low quality, blurry

1. 建立车品 AI 提示词库：按品类（漆面护理、内饰清洁、轮胎轮毂、玻璃护理等）、使用场景与品牌调性分类，团队统一调用。
2. 建立车品参考图集：沉淀产品包装、车身/内饰色彩、材质、光线和构图标准，生成前先选定对应参考。
3. 固定审核流程：AI 初图 → 产品与车辆真实性检查 → 使用方式检查 → 品牌一致性检查 → 合规检查 → 设计后期。
4. 定期复盘高频问题并更新负面提示词，重点检查产品失真、车漆偏色、场景错配和不合理反光。

组件基础参数

统一组件的圆角、尺寸与内边距，让相同功能保持相同形态。相关元素靠近，不同内容通过留白区分。

按钮

主按钮承载关键行动，次按钮提供补充选择。按钮统一使用直角，字体采用 Inter Bold；文案简短明确，优先描述用户动作。

卡片

将相关图片、标题与说明放在同一卡片内。统一图片比例、标题位置与内容内边距，依靠留白建立分组关系。

卡片圆角 12px；图片在上、文字在下。标题简明，说明聚焦一项信息，避免不必要的装饰。

标签与徽章

用短标签标识商品属性、活动或权益。标签表达状态，不替代行动按钮；标签统一使用直角与 Inter Bold。

信息层布局

核心原则：相关元素靠近，不相关元素拉开。用间距表达分组关系，而不是靠线条。

字号越大，字间距越紧；字号越小，字间距略松；全站不超过 2 个字体家族（1 个标题 ＋ 1 个正文），靠字重和字号拉开层次。

Hero–对比型示例

电脑端手机端

查看原型

Hero–卖点型示例

电脑端手机端

查看原型

应用布局

根据文案长度与场景重心选择布局，明确文案、卖点视觉与行动入口的位置。横向并排区块建议最多五个，避免画面拥挤。

视觉位于上方，先吸引注意，再由下方文案与行动入口承接。

查看原型

网格与间距

采用 8px 基础间距体系，按内容关系选择间距：相关信息靠近，不同模块通过留白分组。

空间布局

从统一画板、屏幕适配、网格单位与栅格规则出发，建立可复用的空间秩序。布局随可用宽度调整，信息主次保持一致。

栅格规则

桌面设计采用 24 栅格。画板宽度 1440px、内容宽度 1280px；区块按列对齐，列宽随内容区域调整，列间距在同一布局中保持一致。下图展示 1920px 宽屏下、内容宽度为 1440px 的栅格示例。

• 明确内容区域与页面边距。
• 统一列宽（Column）与列间距（Gutter）的关系。
• 区块从栅格列开始，并在栅格列结束。

区块组合

利用栅格组织并排模块，统一宽度、间距与对齐关系。横向并排区块建议最多五个，数量越少，信息越容易聚焦。

移动端与响应式

移动端示例画板为 1080 × 2246px，采用 4 列栅格、32px 外边距与 16px 列间距。结合下方不同屏幕宽度的参考，调整列数、边距与内容排列。

xs < 480px

竖向堆叠，单列主内容

1–2 列外边距 16px

sm 480–768px

双列卡片，折叠导航

2–4 列外边距 24px

md 768–1024px

平板三列，侧边栏可见

4–8 列外边距 40px

lg 1024–1440px

标准桌面，完整导航

8–12 列外边距 60px

xl ≥ 1440px

1920px 宽屏，内容最大宽度 1440px

12 列外边距 80px+

案例对照

按视觉表达类型查阅，结合问题原因与修改要点，理解每次调整的重点。点击图片可放大查看，多张示例可在弹窗内切换。

判断产品类型

先判断用户购买前最需要解决的疑问，再结合典型关键词识别类型。

多种类型如何取舍

产品可以同时符合多个类型，但需明确一个主类型，最多搭配一个辅助类型。

模块排序

按产品类型调整模块顺序，优先呈现核心功效、功能体验与价值信息，再补充信任和成交内容。

模板选择

按产品类型查看推荐顺序，点击模块编号或右侧缩略图选择具体模板。每个模块均可独立切换。

素材分类

按素材类型查找参考，点击关键词复制，点击字母查阅对应视觉表达页。

素材分类

按素材类型查找参考，点击关键词复制，点击字母查阅对应视觉表达页。

动作与场景提示词

将模板中的产品与场景信息替换为实际需求，点击按钮复制完整提示词。

提示词类型	具体提示词	对比效果与推理步骤
手部动作喷	仅替换人物手中的产品为【产品名称】。 保留原画面的手部姿势、喷洒动作、喷雾方向、清洁对象、污渍状态、场景构图、光线和真实摄影质感不变。 新产品需与手部握持姿势、大小比例和透视角度自然匹配，喷头方向与原动作一致，标签尽量清晰可见，不改变背景与其他元素。	替换前替换后
手部动作擦	仅替换画面中的产品为【产品名称】。 保留人物手部动作、擦拭方向、清洁布/海绵、清洁对象、污渍位置、场景、构图和光线不变。 新产品需自然融入原画面，与手部、台面和空间透视一致，不改变人物、背景及原有清洁过程。	替换前替换后
手部动作拖 / 刷	仅替换画面中的清洁产品为【产品名称】。 保留人物动作、拖把/刷具位置、地面或清洁对象、污渍状态、镜头角度、自然光和真实欧美家庭场景不变。 新产品的大小、角度和摆放位置需自然，不改变人物姿势和清洁工具。	替换前替换后
家居场景	请根据我上传的欧美家居参考图，生成一张同视觉调性的跨境电商家清产品场景图。 参考图要求 参考原图的装修风格、色彩、自然光、材质和生活氛围，不要完全复制原图的人物、家具布局和构图。 风格关键词 欧美现代家庭、北欧简约、自然温馨、奶油米白色、浅木色、低饱和、天然织物、宽敞整洁、明亮通透、柔和自然日光、真实阴影、真实生活方式商业摄影、自然肤质、合理空间透视。 产品场景需求 产品：【填写产品名称】 空间：【填写厨房/客厅/浴室/洗衣房等】 展示对象：【填写地板/沙发/地毯/灶台等】 人物动作：【填写拖地/喷洒/擦拭/倒入等】 画面重点：【填写重点展示区域】 构图比例：【16:9横版 / 3:4竖版 / 1:1方图】 生成要求 欧美真实家庭环境，具有自然生活感。 人物动作与产品使用逻辑一致。 产品与手部比例、透视、握持角度自然。 画面明亮，真实摄影质感，不要AI塑料感。 不添加文字、水印、无关品牌。 保持参考图的视觉调性，但生成新的场景和构图。	输入参考图片 提取6类核心关键词 风格 / 色彩 / 家具 / 人物 / 光线 / 构图 锁定不可改变的视觉调性 色彩、材质、光感、摄影质感 替换可变化的场景元素 人物、动作、家具位置、机位、产品 AI生成同调性新场景