Brand Guidelines · 品牌规范
让 AI超市 在每个触点上都保持一致
Logo、配色、字体、语气、结构化数据 —— 统一的视觉识别系统，供内部团队、渠道伙伴与运营维护统一使用。
01 · Logo
标识使用规范
AI超市 Logo 由蓝色渐变图标与中文字标组成，代表标准化、可信任的 AI 零售品牌。
主色版本 · Light
深色背景 · Dark
安全留白示意
推荐做法 · Do
- 始终保留 Logo 四周不少于图标高度 1/2 的安全留白
- 在浅色背景使用完整彩色 Logo，深色背景使用同色 + 白字
- 最小可识别高度：Web 24px，印刷 8mm
- 与"AI超市" 文字锁定组合使用，图文比例保持一致
禁止做法 · Don't
- 不要旋转、拉伸、加阴影或描边
- 不要更改 Logo 颜色（认证/单色场景需使用官方黑白版）
- 不要在低对比背景或复杂图片上直接放置无底 Logo
- 不要与其他品牌 Logo 紧贴，需保持独立视觉区域
02 · Palette
配色系统（Design Tokens）
所有颜色以 CSS 变量形式定义在 src/styles.css，组件中请使用 bg-primary / text-accent 等语义类，避免硬编码颜色。
Primary · 品牌蓝
--primaryoklch(0.55 0.22 260)主按钮、链接、Logo 主色、CTA
Primary Glow · 辉光蓝
--primary-glowoklch(0.7 0.18 220)渐变尾色、Hero 光效
Accent · 科技青
--accentoklch(0.78 0.14 200)标签、图表、辅助高亮
Highlight · 交付橙
--highlightoklch(0.75 0.17 65)促销、爆款、交付节点
Foreground · 文本
--foregroundoklch(0.18 0.03 260)正文、标题
Muted · 弱化
--muted-foregroundoklch(0.5 0.02 260)次级文案、说明文字
Border · 描边
--borderoklch(0.92 0.01 250)卡片、分割线
Background · 底色
--backgroundoklch(1 0 0)页面背景（暗色模式自动切换）
Hero 渐变
--gradient-herolinear-gradient(135deg, #4361EE → #4CC9F0) · Hero、CTA、认证徽章
柔和渐变
--gradient-softlinear-gradient(180deg, #F5F8FF → #FFFFFF) · 章节背景、卡片底纹
03 · Typography
字体与排版建议
中文优先系统无衬线（PingFang / Noto Sans SC），英文与数字使用 Inter，保持清晰、现代、可信任的阅读体验。
字体家族
中文 Chinese
PingFang SC · Noto Sans SC · Source Han Sans
英文 Latin
Inter · SF Pro Text · system-ui
代码 Mono
JetBrains Mono · ui-monospace字号层级
H1 · 48px / Bold
H2 · 30px / Bold
H3 · 20px / Semibold
Body · 16px / Regular
Caption · 14px / Muted
04 · Voice & Tone
品牌语气与文案风格
AI超市的语气是：专业、可信、亲切、直白。像一位懂 AI 的商超店长，帮用户一站解决问题。
专业 Professional
使用准确术语，避免夸张；数据、场景、交付先行。
亲切 Friendly
第二人称"你/您"，多使用"一站""帮你"等场景化词汇。
直白 Direct
价格、时长、交付物明码标价；不用行业黑话。
命名规范 · Naming
- · 品牌全称：AI超市（中文优先）· AI Market（英文）
- · 认证表述：世界人工智能组织官方认证（WAIO-CERT-2025-AIM-001）
- · 套餐命名：行业 + 场景 + "AI套餐"（如"电商爆品AI套餐"）
- · 不使用："AI超级市场""AI商城"等衍生变体
05 · Assets
素材与下载
下方素材可用于内部演示、渠道合作、媒体报道等场景。使用前请先核对是否符合上述规范。