# Blue White Chart

> 采用清爽克制的蓝白商务图表风，整体像一份被打磨过的企业经营分析报告：理性、秩序感强、信息密度高，但不压迫。白色画布上用深蓝建立权威感，用浅蓝和灰蓝制造层级，所有视觉都服务于数据、逻辑和决策表达。

- Skill: `arcsin1/blue-white-chart` (Agent Skill, multi-file: 3 files)
- Install (CLI): `npx skillmds@latest add arcsin1/blue-white-chart`
- Raw SKILL.md: https://api.skillmd.com/api/skills/arcsin1/blue-white-chart/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: arcsin1 (https://skillmd.com/u/arcsin1)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/arcsin1/blue-white-chart

---

采用清爽克制的蓝白商务图表风，整体像一份被打磨过的企业经营分析报告：理性、秩序感强、信息密度高，但不压迫。白色画布上用深蓝建立权威感，用浅蓝和灰蓝制造层级，所有视觉都服务于数据、逻辑和决策表达。

## 配色
主色是沉稳的企业深蓝 #305598，用在标题、分隔线、核心模块、数据柱和关键图形上，像一条稳定的业务主线。辅助蓝包括明亮商务蓝 #4472C4、柔和中蓝 #5B80D1、淡蓝灰 #A0B8E2、#B4C6E7、#D0DBEF，用来区分层级和模块状态。背景以干净白色 #FFFFFF 为主，局部使用极浅冷灰蓝 #F1F5F9、#F3F6FC、#F2F2F2 做信息区底色。正文常用黑灰 #000000、#262626、#404040，强调数字和标题可用深海军蓝 #00329D、#002576。整体避免花哨高饱和色，只在复杂图表中可少量引入红 #DC2626、绿 #16A34A、橙 #F59E0B 作为数据线辅助。

## 字体
标题使用思源黑体或同类粗黑体，字形方正、干净、有企业级可信度；正文和数字大量使用 Roboto，数字感清晰，适合展示百分比、金额、KPI 和趋势值。中文标题可以保持 40–53px 的大字号，正文多在 18–23px，关键数字可放大到 53–73px，让页面有强烈的数据锚点。

## 排版
版式以 16:9 宽屏画布为基础，常见结构是左上标题、下方一条深蓝横向分隔线，然后进入内容区。信息组织偏网格化和模块化：顶部 KPI 卡片、中部图表区、侧边说明区、底部结论或指标条。页面经常使用左右分栏、上下分区、四宫格卡片、时间轴、环形图和矩阵表，整体比例稳健，留白适中，强调一屏讲清楚一个业务问题。

## 图表与装饰
核心视觉语言来自数据图表和逻辑图，而不是插画。可以大量使用折线图、柱状图、饼图、环形图、气泡图、流程图、矩阵表、漏斗关系、环形整合图、年度目标闭环图、立方体组合和 KPI 数据卡。装饰元素要保持商务感：细长深蓝横线、虚线框、浅蓝半透明底板、圆环、方块、箭头、小图标式几何块。几何图形可以轻微旋转或叠放，但仍要保持精确、冷静、像咨询报告中的逻辑模型。

## 布局
优先使用大面积白底，深蓝用于建立视觉骨架。标题通常靠左，下面配一条横贯页面的蓝色细线；内容区采用严谨的对齐系统，模块之间保持明确边界。数据页可以把左侧设置为深蓝重点区，放大百分比和核心结论，右侧放图表；逻辑页可用浅蓝虚线框承载模块，中央用圆环、闭环或立体方块表现关系。不要让页面像海报一样情绪化，而要像一份董事会汇报材料，清楚、稳、可信。

## 动画
动画应当克制而专业。标题和分隔线可使用 0.4s–0.6s 的淡入或从左轻滑入；图表适合按数据系列逐步出现，柱状图从底部增长，折线图沿路径绘制，环形图顺时针展开。模块卡片可用轻微 fade-up，避免弹跳、夸张缩放或炫光效果。

## 适合场景
经营分析汇报、营销运营复盘、销售数据看板、企业战略规划、咨询报告、财务看板、项目阶段目标和企业内部汇报。它尤其适合需要大量图表、数据、流程和逻辑模型的 PPT，让信息看起来专业、可信、可执行。

## 配图
不支持配图。

## 不要
- 不要使用大面积艳丽渐变或霓虹色
- 不要使用手绘、水彩、卡通插画等松散元素
- 不要让字体过于圆润可爱或装饰化
- 不要堆叠过多阴影和复杂纹理
- 不要破坏网格对齐，所有模块都应显得精确、理性、有秩序