476 lines
17 KiB
Markdown
476 lines
17 KiB
Markdown
|
# PPT 主题配色方案设计规格
|
|||
|
|
|
|||
|
|
> 设计师交付物 · v2.0 · 2026-02-22
|
|||
|
|
> 参考来源：顶级投行 "Guide to the Markets" 系列报告
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## Design Tokens（结构化布局参数）
|
|||
|
|
|
|||
|
|
所有主题通过 `_theme()` 工厂函数自动包含以下 token（由 `_LAYOUT_DEFAULTS` 兜底）：
|
|||
|
|
|
|||
|
|
| Token | 默认值 | 用途 |
|
|||
|
|
|-------|--------|------|
|
|||
|
|
| `slide_w` | 13.333" | 幻灯片宽度（16:9 默认），4:3 时自动设为 10.0" |
|
|||
|
|
| `slide_h` | 7.5" | 幻灯片高度（固定） |
|
|||
|
|
| `cover_title_size` | 36 pt | 封面/标题页大字号 |
|
|||
|
|
| `page_title_size` | 16 pt | 内容页标题字号（投行级标准） |
|
|||
|
|
| `chart_subtitle_size` | 11 pt | 图表副标题字号 |
|
|||
|
|
| `footer_size` | 8 pt | 页脚来源/页码字号 |
|
|||
|
|
| `header_y` | 0.25" | 页眉标题 y 坐标 |
|
|||
|
|
| `divider_y` | 0.80" | 标题下分隔线 y 坐标 |
|
|||
|
|
| `divider_h` | 0.015" | 分隔线高度 |
|
|||
|
|
| `content_y` | 1.00" | 内容区起始 y 坐标 |
|
|||
|
|
| `content_h` | 5.80" | 内容区高度 |
|
|||
|
|
| `content_w` | 自动派生 | 内容区宽度 = `slide_w - 2 * margin`（16:9 下为 12.133"） |
|
|||
|
|
| `footer_y` | 7.10" | 页脚 y 坐标 |
|
|||
|
|
| `table_header_bg` | 跟随 primary | 表头背景色 |
|
|||
|
|
| `table_zebra_even` | `F8FAFC` | 表格偶数行背景 |
|
|||
|
|
| `table_zebra_odd` | `FFFFFF` | 表格奇数行背景 |
|
|||
|
|
| `chart_default_scheme` | 跟随主题名 | 图表自动配色方案 |
|
|||
|
|
|
|||
|
|
**比例预设**：`resolve_theme(theme, aspect_ratio="4:3")` 会自动将 `slide_w` 设为 10.0"，并重新计算 `content_w`。所有布局均使用 `theme["slide_w"]` 而非硬编码值。
|
|||
|
|
|
|||
|
|
**重要**：图表配色现在自动关联主题。使用 `jp_finance` 主题时，图表默认使用 `jp_finance` 配色，无需手动指定 `style_config`。
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 设计原则
|
|||
|
|
|
|||
|
|
### 从顶级投行研报提炼的金融报告配色规律
|
|||
|
|
|
|||
|
|
1. **主色调不超过 2 种**：一个中性深色（标题/边框），一个品牌亮色（折线/强调）
|
|||
|
|
2. **金色/琥珀作为第三色**：用于参考线、平均线、KPI 强调数字——几乎所有顶级金融报告都用这个技巧
|
|||
|
|
3. **浅色背景要极浅**：内容页背景不是纯白，而是极浅的品牌色调（如 `#F4F6FA`，极浅蓝灰）
|
|||
|
|
4. **正负色要和品牌色区分**：不能让绿色和主色相撞，不能让红色和强调色相撞
|
|||
|
|
5. **图表系列色的排列逻辑**：第1色给面积最大的柱/面积图（用中性色），第2色给折线（用饱和度高的色），后续色交替深浅
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 主题一：jp_finance（金融/银行）
|
|||
|
|
|
|||
|
|
**设计意图**：顶级投行同款风格。深海军蓝 + 品牌 Teal + 金色。稳重、专业、信赖感。
|
|||
|
|
**参考**：顶级投行、高盛、中金公司年报
|
|||
|
|
|
|||
|
|
### 颜色规格
|
|||
|
|
|
|||
|
|
| 变量 | 色值 | 预览说明 |
|
|||
|
|
|------|------|---------|
|
|||
|
|
| `primary` | `1B3D6E` | 深海军蓝——标题栏、表头、KPI数字 |
|
|||
|
|
| `secondary` | `00A5BD` | 品牌 Teal——装饰线、折线图主线 |
|
|||
|
|
| `accent` | `C9A84C` | 金琥珀——强调线、平均线、KPI高亮 |
|
|||
|
|
| `bg_dark` | `0F2340` | 极深海军——标题页/结论页背景 |
|
|||
|
|
| `bg_light` | `F4F6FA` | 极浅蓝灰——内容页背景（接近白色但有温度） |
|
|||
|
|
| `card_bg` | `FFFFFF` | 纯白——卡片/面板背景 |
|
|||
|
|
| `text_dark` | `1A2744` | 深蓝黑——浅底正文 |
|
|||
|
|
| `text_light` | `FFFFFF` | 纯白——深底文字 |
|
|||
|
|
| `text_muted` | `6B7C93` | 蓝灰——脚注、数据来源、次要说明 |
|
|||
|
|
| `border` | `C8D6E5` | 浅蓝灰——卡片边框、分割线 |
|
|||
|
|
| `positive` | `0B7B3E` | 森林绿——正收益、上涨 |
|
|||
|
|
| `negative` | `C0392B` | 标准红——负收益、下跌 |
|
|||
|
|
|
|||
|
|
### 排版规格
|
|||
|
|
|
|||
|
|
| 变量 | 值 |
|
|||
|
|
|------|-----|
|
|||
|
|
| `header_font` | 微软雅黑 |
|
|||
|
|
| `body_font` | 微软雅黑 |
|
|||
|
|
| `title_size` | 28 pt |
|
|||
|
|
| `subtitle_size` | 18 pt |
|
|||
|
|
| `body_size` | 12 pt |
|
|||
|
|
| `caption_size` | 9 pt |
|
|||
|
|
|
|||
|
|
### 图表系列配色（8色序列）
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
色1 A8D5DC —— 浅teal，柱状图/面积图（面积最大，用浅色避免压迫感）
|
|||
|
|
色2 1B3D6E —— 深海军蓝，主折线（对比最强）
|
|||
|
|
色3 C9A84C —— 金琥珀，参考线/第二折线
|
|||
|
|
色4 4A8FB8 —— 中蓝，第三系列
|
|||
|
|
色5 7FBFCF —— 中浅teal，第四系列
|
|||
|
|
色6 A07840 —— 深琥珀，第五系列
|
|||
|
|
色7 8FA8C0 —— 蓝灰，第六系列
|
|||
|
|
色8 505868 —— 深灰，负向/中性系列
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 热力图配色
|
|||
|
|
|
|||
|
|
- **红蓝发散**（用于通胀、利率偏离）：`C0392B` → `F5CBA7` → `FFFFFF` → `AED6F1` → `1B3D6E`
|
|||
|
|
- **绿红发散**（用于PMI扩张/收缩）：`0B7B3E` → `A9DFBF` → `FFFFFF` → `F5B7B1` → `C0392B`
|
|||
|
|
|
|||
|
|
### 章节色标签（左侧竖条）
|
|||
|
|
|
|||
|
|
| 章节 | 色值 |
|
|||
|
|
|------|------|
|
|||
|
|
| 宏观经济 | `00A5BD`（secondary） |
|
|||
|
|
| 权益资产 | `C9A84C`（accent） |
|
|||
|
|
| 固定收益 | `1B3D6E`（primary） |
|
|||
|
|
| 另类资产 | `4A8FB8` |
|
|||
|
|
| 投资原则 | `0B7B3E` |
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 主题二：pension_warm（养老金/保险）
|
|||
|
|
|
|||
|
|
**设计意图**：可信赖、安全感、长期主义。暖蓝色调搭配琥珀，避免冷峻感。
|
|||
|
|
**参考**：社保基金、泰康人寿、平安年报
|
|||
|
|
|
|||
|
|
### 颜色规格
|
|||
|
|
|
|||
|
|
| 变量 | 色值 | 预览说明 |
|
|||
|
|
|------|------|---------|
|
|||
|
|
| `primary` | `2E5FA3` | 沉稳蓝——标题栏、表头 |
|
|||
|
|
| `secondary` | `7BA7BC` | 天蓝灰——辅助色块、卡片边框 |
|
|||
|
|
| `accent` | `D4903F` | 暖琥珀——KPI数字、强调线（比金融主题更暖） |
|
|||
|
|
| `bg_dark` | `1C3557` | 深蓝夜——标题页背景 |
|
|||
|
|
| `bg_light` | `F7F4F0` | 暖白——内容页背景（带一点米色，比冷白更温暖） |
|
|||
|
|
| `card_bg` | `FDFAF7` | 暖白卡片 |
|
|||
|
|
| `text_dark` | `2C3E50` | 深蓝灰——正文 |
|
|||
|
|
| `text_light` | `FAFAFA` | 近白——深底文字 |
|
|||
|
|
| `text_muted` | `7F8C8D` | 中灰——脚注 |
|
|||
|
|
| `border` | `D5C9B8` | 暖米灰——边框（带棕色调） |
|
|||
|
|
| `positive` | `27AE60` | 绿——正向 |
|
|||
|
|
| `negative` | `E74C3C` | 红——负向 |
|
|||
|
|
|
|||
|
|
### 排版规格
|
|||
|
|
|
|||
|
|
| 变量 | 值 |
|
|||
|
|
|------|-----|
|
|||
|
|
| `header_font` | 微软雅黑 |
|
|||
|
|
| `body_font` | 微软雅黑 |
|
|||
|
|
| `title_size` | 28 pt |
|
|||
|
|
| `subtitle_size` | 18 pt |
|
|||
|
|
| `body_size` | 12 pt |
|
|||
|
|
| `caption_size` | 9 pt |
|
|||
|
|
|
|||
|
|
### 图表系列配色（8色序列）
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
色1 A8C4D4 —— 浅天蓝，柱状图/面积图
|
|||
|
|
色2 2E5FA3 —— 主蓝，主折线
|
|||
|
|
色3 D4903F —— 暖琥珀，第二折线/参考线
|
|||
|
|
色4 7BA7BC —— 天蓝灰，第三系列
|
|||
|
|
色5 B0C9B0 —— 浅绿灰，第四系列
|
|||
|
|
色6 9C7B48 —— 深暖棕，第五系列
|
|||
|
|
色7 8A9DB8 —— 蓝灰，第六系列
|
|||
|
|
色8 606870 —— 中灰，中性系列
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 主题三：tech_blue（科技/互联网）
|
|||
|
|
|
|||
|
|
**设计意图**：冷峻、未来感、数据驱动。深底色上配电光蓝/青，科技感不浮夸。
|
|||
|
|
**参考**：腾讯、字节跳动、微软年报
|
|||
|
|
|
|||
|
|
### 颜色规格
|
|||
|
|
|
|||
|
|
| 变量 | 色值 | 预览说明 |
|
|||
|
|
|------|------|---------|
|
|||
|
|
| `primary` | `1565C0` | 深科技蓝——标题栏 |
|
|||
|
|
| `secondary` | `29B6F6` | 亮天蓝——装饰线、折线 |
|
|||
|
|
| `accent` | `00BFA5` | 青绿——KPI强调（区别于蓝，增加层次） |
|
|||
|
|
| `bg_dark` | `0A1628` | 极深夜蓝——标题页 |
|
|||
|
|
| `bg_light` | `F0F4FF` | 极浅冰蓝——内容页 |
|
|||
|
|
| `card_bg` | `FFFFFF` | 纯白 |
|
|||
|
|
| `text_dark` | `102040` | 深蓝黑——正文 |
|
|||
|
|
| `text_light` | `E8F1FF` | 冰白——深底文字 |
|
|||
|
|
| `text_muted` | `7A8CA8` | 蓝灰——脚注 |
|
|||
|
|
| `border` | `C0D0E8` | 浅冰蓝——边框 |
|
|||
|
|
| `positive` | `00C896` | 青绿——正向（与 accent 同系） |
|
|||
|
|
| `negative` | `FF4B5C` | 亮红——负向 |
|
|||
|
|
|
|||
|
|
### 排版规格
|
|||
|
|
|
|||
|
|
| 变量 | 值 |
|
|||
|
|
|------|-----|
|
|||
|
|
| `header_font` | 微软雅黑 |
|
|||
|
|
| `body_font` | 微软雅黑 |
|
|||
|
|
| `title_size` | 28 pt |
|
|||
|
|
| `subtitle_size` | 18 pt |
|
|||
|
|
| `body_size` | 12 pt |
|
|||
|
|
| `caption_size` | 9 pt |
|
|||
|
|
|
|||
|
|
### 图表系列配色（8色序列）
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
色1 90CAF9 —— 浅冰蓝，柱状图/面积图
|
|||
|
|
色2 1565C0 —— 深科技蓝，主折线
|
|||
|
|
色3 00BFA5 —— 青绿，第二折线
|
|||
|
|
色4 7E57C2 —— 紫蓝，第三系列
|
|||
|
|
色5 29B6F6 —— 亮天蓝，第四系列
|
|||
|
|
色6 FF7043 —— 橙，第五系列（暖冷对比）
|
|||
|
|
色7 90A4AE —— 蓝灰，第六系列
|
|||
|
|
色8 546E7A —— 深蓝灰，中性系列
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 主题四：state_red（政府/国企）
|
|||
|
|
|
|||
|
|
**设计意图**：庄重大气，中国红+金。权威感，绝不轻浮。
|
|||
|
|
**参考**：中央汇金、国投集团、招商局、国家电网年报
|
|||
|
|
|
|||
|
|
### 颜色规格
|
|||
|
|
|
|||
|
|
| 变量 | 色值 | 预览说明 |
|
|||
|
|
|------|------|---------|
|
|||
|
|
| `primary` | `8B0000` | 中国深红——标题栏（比 C00000 更沉稳） |
|
|||
|
|
| `secondary` | `B8860B` | 深金——装饰线、辅助色块 |
|
|||
|
|
| `accent` | `DAA520` | 亮金——KPI数字、强调线 |
|
|||
|
|
| `bg_dark` | `5C0000` | 极深红——标题页背景 |
|
|||
|
|
| `bg_light` | `FDF8F0` | 暖象牙白——内容页背景（金色调） |
|
|||
|
|
| `card_bg` | `FFFFFF` | 纯白 |
|
|||
|
|
| `text_dark` | `2C1810` | 深暖棕黑——正文 |
|
|||
|
|
| `text_light` | `FFF8E7` | 暖白——深底文字 |
|
|||
|
|
| `text_muted` | `8C7B6B` | 暖棕灰——脚注 |
|
|||
|
|
| `border` | `E0CFAA` | 浅金——边框 |
|
|||
|
|
| `positive` | `2E6B30` | 深绿——正向 |
|
|||
|
|
| `negative` | `8B0000` | 深红（与primary同色，符合国企审美） |
|
|||
|
|
|
|||
|
|
### 排版规格
|
|||
|
|
|
|||
|
|
| 变量 | 值 |
|
|||
|
|
|------|-----|
|
|||
|
|
| `header_font` | 微软雅黑 |
|
|||
|
|
| `body_font` | 微软雅黑 |
|
|||
|
|
| `title_size` | 28 pt |
|
|||
|
|
| `subtitle_size` | 18 pt |
|
|||
|
|
| `body_size` | 12 pt |
|
|||
|
|
| `caption_size` | 9 pt |
|
|||
|
|
|
|||
|
|
### 图表系列配色（8色序列）
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
色1 CDAC60 —— 暖金，柱状图/面积图（国企标配）
|
|||
|
|
色2 8B0000 —— 深红，主折线
|
|||
|
|
色3 B8860B —— 深金，第二折线/参考线
|
|||
|
|
色4 4A6FA5 —— 蓝灰（对比色），第三系列
|
|||
|
|
色5 C07840 —— 暖橙棕，第四系列
|
|||
|
|
色6 507050 —— 深绿，第五系列
|
|||
|
|
色7 907878 —— 暖灰，第六系列
|
|||
|
|
色8 585048 —— 深暖灰，中性系列
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 主题五：esg_green（ESG/绿色）
|
|||
|
|
|
|||
|
|
**设计意图**：可持续发展，自然生命力。深绿 + 白 + 浅绿，干净不沉闷。
|
|||
|
|
**参考**：ESG基金报告、绿色债券报告、UNPRI年报
|
|||
|
|
|
|||
|
|
### 颜色规格
|
|||
|
|
|
|||
|
|
| 变量 | 色值 | 预览说明 |
|
|||
|
|
|------|------|---------|
|
|||
|
|
| `primary` | `1A5C2A` | 深森林绿——标题栏 |
|
|||
|
|
| `secondary` | `4CAF50` | 中绿——装饰线 |
|
|||
|
|
| `accent` | `8BC34A` | 黄绿——强调色（比绿更活力） |
|
|||
|
|
| `bg_dark` | `0D3318` | 极深绿夜——标题页 |
|
|||
|
|
| `bg_light` | `F1F8F2` | 极浅绿白——内容页 |
|
|||
|
|
| `card_bg` | `FFFFFF` | 纯白 |
|
|||
|
|
| `text_dark` | `1B2B1C` | 深绿黑——正文 |
|
|||
|
|
| `text_light` | `E8F5E9` | 浅绿白——深底文字 |
|
|||
|
|
| `text_muted` | `5C7A5E` | 中绿灰——脚注 |
|
|||
|
|
| `border` | `B8D8BA` | 浅绿——边框 |
|
|||
|
|
| `positive` | `2E7D32` | 绿——正向（与主色同系） |
|
|||
|
|
| `negative` | `C62828` | 红——负向（与品牌色对比强） |
|
|||
|
|
|
|||
|
|
### 排版规格
|
|||
|
|
|
|||
|
|
| 变量 | 值 |
|
|||
|
|
|------|-----|
|
|||
|
|
| `header_font` | 微软雅黑 |
|
|||
|
|
| `body_font` | 微软雅黑 |
|
|||
|
|
| `title_size` | 28 pt |
|
|||
|
|
| `subtitle_size` | 18 pt |
|
|||
|
|
| `body_size` | 12 pt |
|
|||
|
|
| `caption_size` | 9 pt |
|
|||
|
|
|
|||
|
|
### 图表系列配色（8色序列）
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
色1 A5D6A7 —— 浅绿，柱状图/面积图
|
|||
|
|
色2 1A5C2A —— 深森林绿，主折线
|
|||
|
|
色3 8BC34A —— 黄绿，第二折线
|
|||
|
|
色4 00838F —— 深青，第三系列（绿系对比色）
|
|||
|
|
色5 C8E6C9 —— 极浅绿，第四系列（叠加面积用）
|
|||
|
|
色6 795548 —— 棕（大地色，与绿呼应），第五系列
|
|||
|
|
色7 78909C —— 蓝灰，第六系列
|
|||
|
|
色8 607D8B —— 深蓝灰，中性系列
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 主题六：morningstar（研究/晨星风格）
|
|||
|
|
|
|||
|
|
**设计意图**：受 Morningstar 市场报告启发。深石板灰 + 中蓝 + 暖橙。信息密度高、学术感强、适合研究报告。
|
|||
|
|
**参考**：Morningstar 市场报告、学术期刊、卖方研报
|
|||
|
|
|
|||
|
|
### 颜色规格
|
|||
|
|
|
|||
|
|
| 变量 | 色值 | 预览说明 |
|
|||
|
|
|------|------|---------|
|
|||
|
|
| `primary` | `1D2B3A` | 深石板灰——标题栏、表头 |
|
|||
|
|
| `secondary` | `5A9BD5` | 中蓝——装饰线、折线 |
|
|||
|
|
| `accent` | `E67E22` | 暖橙——KPI强调、参考线 |
|
|||
|
|
| `bg_dark` | `1A1A2E` | 深紫灰夜——标题页背景 |
|
|||
|
|
| `bg_light` | `FAFBFC` | 极浅灰白——内容页背景 |
|
|||
|
|
| `card_bg` | `FFFFFF` | 纯白 |
|
|||
|
|
| `text_dark` | `2C3E50` | 深蓝灰——正文 |
|
|||
|
|
| `text_light` | `F8F9FA` | 近白——深底文字 |
|
|||
|
|
| `text_muted` | `7B8794` | 中灰蓝——脚注 |
|
|||
|
|
| `border` | `DEE2E6` | 浅灰——边框 |
|
|||
|
|
| `positive` | `28A745` | 绿——正向 |
|
|||
|
|
| `negative` | `DC3545` | 红——负向 |
|
|||
|
|
|
|||
|
|
### 排版规格
|
|||
|
|
|
|||
|
|
| 变量 | 值 |
|
|||
|
|
|------|-----|
|
|||
|
|
| `header_font` | 微软雅黑 |
|
|||
|
|
| `body_font` | 微软雅黑 |
|
|||
|
|
| `title_size` | 28 pt |
|
|||
|
|
| `subtitle_size` | 18 pt |
|
|||
|
|
| `body_size` | 11 pt（比标准小1pt，提高信息密度） |
|
|||
|
|
| `caption_size` | 9 pt |
|
|||
|
|
| `kpi_size` | 36 pt（比标准小，低调克制） |
|
|||
|
|
|
|||
|
|
### 图表系列配色（8色序列）
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
色1 A4C2D8 —— 浅石板蓝，柱状图/面积图
|
|||
|
|
色2 1D2B3A —— 深石板灰，主折线
|
|||
|
|
色3 E67E22 —— 暖橙，第二折线/参考线
|
|||
|
|
色4 5A9BD5 —— 中蓝，第三系列
|
|||
|
|
色5 95C8D8 —— 浅青蓝，第四系列
|
|||
|
|
色6 B87333 —— 深铜棕，第五系列
|
|||
|
|
色7 7B8794 —— 中灰蓝，第六系列
|
|||
|
|
色8 495057 —— 深灰，中性系列
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 主题七：macro_research（宏观研究）
|
|||
|
|
|
|||
|
|
**设计意图**：学院派宏观研究风格。深藏蓝灰 + 净蓝 + 中性灰。极其低调，让数据本身说话。
|
|||
|
|
**参考**：央行工作论文、IMF报告、学术研究机构出版物
|
|||
|
|
|
|||
|
|
### 颜色规格
|
|||
|
|
|
|||
|
|
| 变量 | 色值 | 预览说明 |
|
|||
|
|
|------|------|---------|
|
|||
|
|
| `primary` | `2C3E50` | 深藏蓝灰——标题栏、表头 |
|
|||
|
|
| `secondary` | `3498DB` | 净蓝——装饰线、折线 |
|
|||
|
|
| `accent` | `95A5A6` | 中性灰——KPI强调（极其低调） |
|
|||
|
|
| `bg_dark` | `1A252F` | 深蓝夜——标题页背景 |
|
|||
|
|
| `bg_light` | `F7F9FB` | 极浅蓝白——内容页背景 |
|
|||
|
|
| `card_bg` | `FFFFFF` | 纯白 |
|
|||
|
|
| `text_dark` | `2C3E50` | 深蓝灰——正文 |
|
|||
|
|
| `text_light` | `ECF0F1` | 浅灰白——深底文字 |
|
|||
|
|
| `text_muted` | `95A5A6` | 中性灰——脚注 |
|
|||
|
|
| `border` | `D5D8DC` | 浅灰——边框 |
|
|||
|
|
| `positive` | `27AE60` | 绿——正向 |
|
|||
|
|
| `negative` | `E74C3C` | 红——负向 |
|
|||
|
|
|
|||
|
|
### 排版规格
|
|||
|
|
|
|||
|
|
| 变量 | 值 |
|
|||
|
|
|------|-----|
|
|||
|
|
| `header_font` | 微软雅黑 |
|
|||
|
|
| `body_font` | 微软雅黑 |
|
|||
|
|
| `title_size` | 28 pt |
|
|||
|
|
| `subtitle_size` | 18 pt |
|
|||
|
|
| `body_size` | 11 pt（高密度） |
|
|||
|
|
| `caption_size` | 9 pt |
|
|||
|
|
| `kpi_size` | 36 pt（低调） |
|
|||
|
|
|
|||
|
|
### 图表系列配色（8色序列）
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
色1 AED6F1 —— 浅蓝，柱状图/面积图
|
|||
|
|
色2 2C3E50 —— 深藏蓝灰，主折线
|
|||
|
|
色3 3498DB —— 净蓝，第二折线/参考线
|
|||
|
|
色4 95A5A6 —— 中性灰，第三系列
|
|||
|
|
色5 85C1E9 —— 中浅蓝，第四系列
|
|||
|
|
色6 1ABC9C —— 青绿，第五系列（微妙对比色）
|
|||
|
|
色7 BDC3C7 —— 浅灰，第六系列
|
|||
|
|
色8 566573 —— 深灰蓝，中性系列
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 主题八：dark_pro（高对比深色）
|
|||
|
|
|
|||
|
|
**设计意图**：投屏演示专用。纯深底 + 电光蓝 + 亮黄，极高对比度，在暗室大屏上最清晰。
|
|||
|
|
**参考**：Bloomberg Terminal 风格、大型路演演示
|
|||
|
|
|
|||
|
|
### 颜色规格
|
|||
|
|
|
|||
|
|
| 变量 | 色值 | 预览说明 |
|
|||
|
|
|------|------|---------|
|
|||
|
|
| `primary` | `00BFFF` | 电光蓝——标题栏、主要高亮 |
|
|||
|
|
| `secondary` | `7B68EE` | 中紫蓝——辅助装饰 |
|
|||
|
|
| `accent` | `FFD700` | 纯金黄——KPI数字、强调线（深底上最醒目） |
|
|||
|
|
| `bg_dark` | `080808` | 近纯黑——所有页背景 |
|
|||
|
|
| `bg_light` | `141820` | 深蓝黑——内容页背景（比 bg_dark 略浅一层） |
|
|||
|
|
| `card_bg` | `1E2430` | 深蓝灰——卡片背景（在黑底上浮出层次） |
|
|||
|
|
| `text_dark` | `E0E8F0` | 冷白——浅底正文（注意：此主题浅底也是深色） |
|
|||
|
|
| `text_light` | `FFFFFF` | 纯白——主要文字 |
|
|||
|
|
| `text_muted` | `6880A0` | 蓝灰——次要文字 |
|
|||
|
|
| `border` | `2A3848` | 深蓝边框——卡片边框 |
|
|||
|
|
| `positive` | `00E676` | 电光绿——正向 |
|
|||
|
|
| `negative` | `FF1744` | 电光红——负向 |
|
|||
|
|
|
|||
|
|
### 排版规格
|
|||
|
|
|
|||
|
|
| 变量 | 值 |
|
|||
|
|
|------|-----|
|
|||
|
|
| `header_font` | 微软雅黑 |
|
|||
|
|
| `body_font` | 微软雅黑 |
|
|||
|
|
| `title_size` | 30 pt（深色背景字号稍大） |
|
|||
|
|
| `subtitle_size` | 20 pt |
|
|||
|
|
| `body_size` | 13 pt |
|
|||
|
|
| `caption_size` | 10 pt |
|
|||
|
|
|
|||
|
|
### 图表系列配色（8色序列）
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
色1 00BFFF —— 电光蓝，主系列（深底上最醒目）
|
|||
|
|
色2 FFD700 —— 金黄，第二折线/参考线
|
|||
|
|
色3 00E676 —— 电光绿，第三系列
|
|||
|
|
色4 7B68EE —— 中紫蓝，第四系列
|
|||
|
|
色5 FF6D00 —— 亮橙，第五系列
|
|||
|
|
色6 E040FB —— 紫，第六系列
|
|||
|
|
色7 A0B0C0 —— 浅蓝灰，中性系列
|
|||
|
|
色8 4A5868 —— 深蓝灰，最低权重系列
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 热力图通用配色规范
|
|||
|
|
|
|||
|
|
所有主题共用以下热力图语义：
|
|||
|
|
|
|||
|
|
### 发散型（偏离基准）
|
|||
|
|
| 描述 | 低端色（负向偏离） | 中间色（基准） | 高端色（正向偏离） |
|
|||
|
|
|------|------------------|--------------|------------------|
|
|||
|
|
| 深色版 | `1B3D6E` | `F5F5F5` | `8B0000` |
|
|||
|
|
| 浅色版 | `AED6F1` | `FFFFFF` | `F5B7B1` |
|
|||
|
|
|
|||
|
|
### 方向型（扩张/收缩）
|
|||
|
|
| 描述 | 收缩端 | 中性 | 扩张端 |
|
|||
|
|
|------|--------|------|--------|
|
|||
|
|
| PMI/增长 | `C0392B` | `F9F3E3` | `1A5C2A` |
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 颜色使用优先级规则（适用所有主题）
|
|||
|
|
|
|||
|
|
1. **双轴图表**：左轴系列用 `色1`（柱/面积），右轴系列用 `色2`（折线）
|
|||
|
|
2. **单轴多系列**：按 `色1→色3→色5→色7`（奇数色偏浅）或 `色2→色4→色6→色8`（偶数色偏深）交替
|
|||
|
|
3. **参考线/均值线**：固定用 `accent` 色 + 虚线样式
|
|||
|
|
4. **预测区域**：主系列改为虚线，颜色不变，透明度降低（视觉上用深色 dash 表示不确定性）
|
|||
|
|
5. **零线**：固定用 `text_dark` 色，加粗（1.5pt）
|
|||
|
|
6. **正/负方向着色**：柱状图正值 `positive`，负值 `negative`（适用于瀑布图、差值图）
|