McKinsey-Style Multi-Page Presentation Generator

Overview

This skill produces professional McKinsey consulting-style HTML slide decks. Every presentation is data-driven, information-dense, and visually rigorous. The workflow covers end-to-end generation: research → planning → slide creation (cover, content, section dividers, TOC, summary) → deployment. All slides are rendered as static HTML with inline SVG charts — no generated images except in rare, data-driven cases.

Workflow (MANDATORY ORDER — No Skipping Steps)

Step 1: Research Phase (CRITICAL — DO FIRST)

NEVER skip this step. Data quality determines presentation quality.

Gather comprehensive data before any slide creation:

Research Objectives

- Market size, CAGR, growth rates
Company metrics and milestones
Competitor analysis and market share
Historical trend data for charts
Verified statistics with source citations

Information Source Prioritization

Tier	Source Type	Examples
1	Official Data/APIs	Company filings, government databases, central banks
2

Search Strategy

Execute multiple targeted searches:

1. "[Topic] market size 2025"
"[Topic] industry report"
"[Company] revenue growth 2025"
"[Topic] competitors market share"
"[Topic] trends forecast 2026"
"[Company] founding history milestones"
"[Topic] CAGR growth rate"
"[Topic] regional breakdown"

Data Quality Requirements

For every piece of data collected, record:

1. The specific data point (number, percentage, fact)
The source name (organization)
The publication date or data date
The original URL

MANDATORY minimums before completing research:

- [ ] At least 15 specific statistics/data points
[ ] At least 5 different sources
[ ] Data for each planned content slide
[ ] Historical trend data for at least 1 chart
[ ] Competitor comparison data
[ ] Proper source citations in PPT format

AVOID:

- ❌ Unsourced claims
❌ Outdated data (>2 years old for fast-moving industries)
❌ Vague qualitative statements ("significant growth")
❌ Single-source critical facts

Research Output Format

CODEBLOCK0

Step 2: Presentation Planning

Based on research findings, plan the slide structure:

- Default: 10 slides (unless user specifies otherwise)
Recommended structure: Cover → Content Pages → Summary
Section dividers are OPTIONAL — only include if content naturally divides into distinct sections
For most presentations, a simple Cover + Content + Summary structure is preferred

Typical 10-slide structure:

- Slide 1: Cover page
Slides 2–9: Content pages with data visualizations
Slide 10: Summary/Conclusion

Step 3: Generate Cover Page

- NO generated images allowed
NO graphical elements (shapes, icons, decorations)
Use solid colors OR subtle gradients ONLY
Centered typography is the PRIMARY visual element
Elegant, restrained, professional

See Cover Page Specifications below.

Step 4: Generate Content Pages

For each content slide:

- Minimum 4 distinct content zones per page
White background is MANDATORY default (80%+ of slides)
SVG charts only — no generated images
Include source citations in footer

See Content Page Specifications below.

Step 5: Generate Optional Pages

If needed, generate:

- Table of Contents (see TOC Specifications)
Section Dividers (see Section Divider Specifications)
Summary/Closing Page (see Summary Page Specifications)

Step 6: Deployment

Deploy the completed presentation using deploy_html_presentation.

Design System

Core Design Philosophy

Professional & Serious: All presentations must be square, formal, and business-appropriate. This is a consulting deck, NOT a creative portfolio.

Data-Driven: Every content slide must be backed by verifiable data with proper source citations.

Information Density: Content pages should maximize information density with at least 4 distinct content zones per slide.

Style: Sharp & Compact — square corners, high information density, professional severity. border-radius: 0 on ALL elements.

Color System

Primary Colors

Element	Color Name	Hex	Usage
Main Background	White	INLINECODE2	Primary slide background (MANDATORY DEFAULT)
Title Bar/Header

Cover Page & Section Divider Background Colors (Choose ONE)

Option	Hex Code	Effect	Text Color
White	INLINECODE8	Clean, minimal, modern	Navy INLINECODE9
Navy Blue

Gradient Options (Cover/Divider pages ONLY, subtle only)

Gradient	CSS Example
Navy to Dark	INLINECODE20
Blue to Navy

background: linear-gradient(180deg, #1B5AB5 0%, #0B1F3A 100%); |

Note: Gradients are ONLY allowed on cover pages and section dividers. Content pages MUST NOT use gradients.

Chart Data Series Colors (use in order)

Series	Color Name	Hex
1	Cobalt Blue	INLINECODE22
2

Cyan Blue | #2E8BC0 | | 3 | Amber Gold | #D4A843 | | 4 | Coral Red | #E05252 | | 5 | Emerald Green | #3AAF6C | | 6 | Purple Gray | #7B6D9E |

Semantic Colors

Purpose	Color	Hex
Positive Data	Green	INLINECODE28
Negative Data

Red | #E05252 |

⚠️ Accent Color Limit (STRICTLY ENFORCED — MAX 2 PER PAGE)

RULE: Maximum 2 accent colors per page. This is NON-NEGOTIABLE.

Type	Colors	Can Use Freely
Base Colors	Navy #0B1F3A, White #FFFFFF, Grays (#2D2D2D, #8C8C8C, #E0E0E0)	✅ Yes
Primary Accent

Enforcement:

1. Before writing HTML: Decide which 2 accent colors you will use
During HTML writing: Only use those 2 colors for accents
During verification: Count accent colors — if >2, FIX by replacing extras with #1B5AB5 or #E0E0E0

ONLY EXCEPTION: Multi-series charts with 3+ distinct data categories may use additional colors within that single chart.

Alternative Color Schemes

Use ONLY when the McKinsey White Theme is not appropriate:

#	Name	Colors	Style	Use Cases
2	Modern Health	INLINECODE30 `#83c5be` `#edf6f9` `#ffddd2` INLINECODE34	Fresh, healing	Healthcare, wellness
3

Typography

Font Family

Language	Font	Notes
Chinese	Microsoft YaHei	Use for all titles and body text
English

Arial / Arial Black | Arial Black for titles, Arial for body |

CSS font-family declaration: INLINECODE61

Typography Hierarchy

Element	Font	Size	Color	Notes
Page Title (Header Bar)	Arial Black	24px	INLINECODE62	White text on dark navy header
Insight/Subtitle

Arial Bold | 16px | #1B5AB5 | Blue text, one-line key insight | | Chart Title | Arial Bold | 12px | #2D2D2D | Above each chart | | Body/Data Labels | Arial | 10–12px | #2D2D2D | Chart labels and body | | Chart Legend | Arial | 9px | #2D2D2D | Below or right of chart | | Footnotes/Sources | Arial | 8px | #8C8C8C | Bottom of slide |

Font Size Limits (STRICT)

Element	Max Size	Notes
Page Title	24px	In header bar
Insight Text

NO element should exceed 48px except in rare stat callout situations.

Forbidden Elements (DO NOT USE)

❌ Forbidden	Reason	✅ Use Instead
Rounded corners (`border-radius`)	Looks casual/playful	Square corners (`border-radius: 0`)
Generated images

Required Style Attributes

CODEBLOCK1

Source Citation Format (MANDATORY)

Every slide containing data MUST include a footer citation:

CODEBLOCK2

Examples:

Type	Example
Financial	INLINECODE70
Research

Image Generation Rules (STRICT)

Maximum 3 images per entire presentation, only for:

- Market Positioning Map (based on actual research data)
Timeline/Milestone Diagram (actual company data)
Process Flow Diagram (actual workflow)
Geographic Map (when location is central)

FORBIDDEN:

- ❌ Generic decorative images
❌ Stock photo style images
❌ Concept illustrations without data
❌ Background images for aesthetics
❌ Icons (use SVG instead)

All other visuals must be SVG charts created in HTML/CSS.

Slide Types

Cover Page

Design: Elegant & Minimal — centered typography only.

ALLOWED Elements

- Solid color backgrounds (from the color palette)
Subtle CSS gradients (linear, very subtle transitions)
Typography as the PRIMARY visual element

FORBIDDEN Elements

- ❌ Generated images
❌ SVG geometric shapes (circles, rectangles, polygons)
❌ Decorative icons or illustrations
❌ Color blocks or split layouts
❌ Any graphical ornamentation

Layout

CODEBLOCK3

Font Size Hierarchy (Cover)

Element	Recommended Size	Ratio to Base
Main Title	72–120px	3x–5x
Subtitle

28–40px | 1.5x–2x | | Supporting Text | 18–24px | 1x (base) | | Meta Info (date, name) | 14–18px | 0.7x–1x |

Cover HTML Example

CODEBLOCK4

Cover Verification Checklist

- [ ] Typography is perfectly centered (horizontal and vertical)
[ ] Text contrast is correct (white text on dark, navy text on light)
[ ] No decorative shapes or graphics present
[ ] Title is NOT truncated — all text fits within the slide
[ ] Clean, elegant, professional appearance

Content Page

Every content slide MUST follow this vertical structure:

CODEBLOCK5

1. Header Bar

- Height: 0.6" (32px)
Background: Deep Navy INLINECODE75
Page Title: Arial Black, 24px, White #FFFFFF, left-aligned with 0.5" padding
Page Number: Right-aligned, White, 14px

CODEBLOCK6

2. Insight Zone

- Position: 0.1" (5px) below header bar
Font: Arial Bold, 16px, Cobalt Blue INLINECODE77
Content: One-line summary of the page's key finding/insight

CODEBLOCK7

3. Content Area

- Left/Right Margins: 0.5" (26px)
Inter-zone Spacing: 0.2" (10px)
Must contain 4+ distinct zones

4. Footer Zone (MANDATORY SOURCE CITATION)

- Height: 0.4" (21px)
Font: Arial, 8px, Medium Gray INLINECODE78

CODEBLOCK8

⚠️ 4-Zone Minimum Layout (MANDATORY)

Every content page MUST have at least 4 distinct content zones.

2x2 Grid

CODEBLOCK9

1+3 Layout

CODEBLOCK10

Content Variety (NOT JUST BULLETS)

Format	When to Use
Prose paragraphs	Context, analysis, explanations (2–4 sentences)
Data tables

Example of good zone variety on one page:

- Zone 1: SVG bar chart with trend data
Zone 2: Prose paragraph explaining context
Zone 3: Data table with competitor comparison
Zone 4: 3 bullet points summarizing key takeaways

Content Subtypes

- Text: bullets/quotes/short paragraphs (still add icons/shapes)
Mixed media: two-column / half-bleed image + text overlay
Data visualization: chart + 1–3 key takeaways + source
Comparison: side-by-side columns/cards (A vs B, pros/cons)
Timeline / process: steps with arrows, journey, phases
Image showcase: hero image, gallery, or visual-first layout

Content Page Verification Checklist

- [ ] Header bar with navy background
[ ] Insight zone with blue text
[ ] 4+ content zones
[ ] Footer with source citation
[ ] Page number badge present
[ ] Text Overflow Check: No text cut off at edges, no truncation with "..."
[ ] Whitespace Check: No large empty gaps (>52px), 70%+ of content area filled, check right side and bottom
[ ] Accent Color Count: ≤2 accent colors (excluding base colors)
[ ] Content Variety: Not all bullet points — mix prose, tables, charts

Layout Options

1. Numbered Vertical List (best for 3–5 sections)
CODEBLOCK11

2. Two-Column Grid (best for 4–6 sections)

3. Sidebar Navigation (modern/corporate)

4. Card-Based Layout (3–4 sections, creative/modern)

Font Size Hierarchy (TOC)

Element	Recommended Size
Page Title ("Table of Contents" / "Agenda")	36–44px
Section Number

28–36px | | Section Title | 20–28px | | Section Description | 14–16px |

Content Elements

1. Page Title — Always required
Section Numbers — Consistent format (01, 02... or I, II...)
Section Titles — Clear and concise
Section Descriptions — Optional one-line summaries
Page Number Badge — MANDATORY (see Appendix G)

Section Divider

Design: Elegant & Minimal — same style as cover pages.

ALLOWED Elements

- Solid color backgrounds (from the color palette)
Subtle CSS gradients
Typography as the PRIMARY visual element
Centered layout only

FORBIDDEN Elements

- ❌ SVG geometric shapes (circles, rectangles, bars, polygons)
❌ Color blocks or split layouts
❌ Accent bars or stripes
❌ Decorative icons or illustrations

Layout

CODEBLOCK12

Font Size Hierarchy (Section Divider)

Element	Recommended Size	Notes
Section Number	72–120px	Bold, accent color or semi-transparent
Section Title

Page Number Badge is MANDATORY (see Appendix G).

Summary / Closing Page

Layout Options

1. Key Takeaways — 3–5 key points with icons or numbered markers

2. CTA / Next Steps — Clear call-to-action prominently displayed

3. Thank You / Contact — Closing message with contact info

4. Split Recap — Left: key takeaways; Right: CTA/contact

Font Size Hierarchy (Summary)

Element	Recommended Size
Closing Title ("Thank You" / "Summary")	48–72px
Takeaway / Action Item

18–24px | | Supporting Text | 14–16px | | Contact Info | 14–16px |

Page Number Badge is MANDATORY (see Appendix G).

Chart & Data Visualization Rules (MANDATORY)

General Chart Rules

1. No outer borders on any chart
Light gray grid lines (#E0E0E0)
Y-axis starts from zero (unless specifically noted)
Data labels directly on charts to reduce legend lookup cost
Legend position: Below chart or right side, 9px font
Square corners on ALL bars — NO rx/ry attributes

Bar/Column Chart

- Corner radius: 0 (SQUARE corners — NO rounded edges)
Bar width ratio: 70% of available space
Use chart series colors in order
NO rx/ry attributes on rect elements

CODEBLOCK13

Line Chart

- Line width: 2px
Data points: Small circles (r=3)
Use chart series colors in order

CODEBLOCK14

Progress Bar (NO ROUNDED CORNERS)

CODEBLOCK15

Pie Charts — Image Generation Tool is MANDATORY

Pie charts MUST be created using the image generation tool. SVG pie charts require arc commands (A) which are forbidden for PPTX conversion. ALL workarounds (layered circles, stroke-dasharray, clip-paths, conic-gradient, rotated segments) WILL FAIL during PPTX conversion.

HTML Implementation Specification

Appendix A — Responsive Scaling Snippet (REQUIRED)

Every slide HTML file MUST include this snippet:

CODEBLOCK16

Appendix B — CSS Rules (REQUIRED)

⚠️ Inline-Only CSS

All CSS styles MUST be inline (except the snippet in Appendix A).

- Do NOT use <style> blocks outside Appendix A
Do NOT use external stylesheets
Do NOT use CSS classes or class-based styling

CODEBLOCK17

⚠️ Background on .slide-content Directly

Do NOT create a full-size background DIV inside .slide-content. Set background directly on .slide-content itself.

CODEBLOCK18

⚠️ No Bold for Body Text and Captions

Reserve bold (font-weight: 600+) for titles, headings, and key emphasis only. Body text, captions, legends, and footnotes must use normal weight (400–500).

Appendix C — Color Palette Rules (REQUIRED)

- Strictly use the provided color palette. Do NOT create or modify color values.
Only exception: You may add opacity to palette colors for overlays (e.g., rgba(r,g,b,0.1))
No gradients on content pages — No CSS linear-gradient(), radial-gradient(), conic-gradient() on content slides
No animations — No CSS animation, @keyframes, transition, hover effects, or SVG INLINECODE94

Appendix D — SVG Conversion Constraints (CRITICAL)

Supported SVG Elements (WHITELIST)

- ✅ <rect> — rectangles (with rx/ry for rounded corners)
✅ <circle> — circles
✅ <ellipse> — ellipses
✅ <line> — straight lines
✅ <polyline> — connected line segments (stroke only, NO fill)
✅ <polygon> — closed polyline (stroke only, NO fill)
✅ <path> — ONLY with M/L/H/V/Z commands
✅ <pattern> — repeating patterns

`<path>` Command Restrictions (CRITICAL)

ONLY these commands are supported:

- ✅ M/m — moveTo
✅ L/l — lineTo
✅ H/h — horizontal line
✅ V/v — vertical line
✅ Z/z — close path

FORBIDDEN commands (will cause SVG to be SKIPPED in PPTX):

- ❌ Q/q — quadratic Bézier curve
❌ C/c — cubic Bézier curve
❌ S/s — smooth cubic Bézier
❌ T/t — smooth quadratic Bézier
❌ A/a — elliptical arc

Additional SVG Constraints

- ❌ NO rotated shapes — transform="rotate()" on shapes causes fallback failure
❌ NO <text> in complex SVGs — SVG text becomes rasterized, not editable in PPTX
❌ Filled <path> must be rectangles — if a path has fill, it must form a closed rectangle with only M/L/H/V/Z
⚠️ Gradients in SVG are DISCOURAGED — technically supported but can break

Workaround: Approximate Curves with Line Segments

CODEBLOCK19

Appendix E — Advanced SVG Techniques

- SVG is for decorative elements ONLY — it does NOT satisfy "real image" requirements
Prefer SVG for all decorative shapes (lines/dividers, corner accents, badges, frames, arrows)
Use SVG when pixel-crisp geometry is needed under INLINECODE119
Background shapes MUST use SVG <rect> or <path>, NOT CSS background/INLINECODE123
Dividers MUST use SVG, NOT CSS background, border, or INLINECODE126

SVG Badge Example (Text INSIDE SVG)

CODEBLOCK20

SVG Background Patterns

CODEBLOCK21

SVG Icons (Supported Patterns)

CODEBLOCK22

SVG Implementation Tips

- Add vector-effect="non-scaling-stroke" to keep stroke widths stable under scaling
For thin lines, prefer filled rectangles over stroked lines
Use overflow="visible" when SVG extends beyond its box
Use aria-hidden="true" for decorative SVGs
Use currentColor for easy theming
Use pointer-events: none for overlay SVGs

Appendix F — HTML2PPTX Validation Rules (REQUIRED)

Layout and Dimensions

- Slide content must not overflow the body (no scroll)
Text elements larger than 12pt must be at least 0.5" above the bottom edge
HTML body dimensions must match presentation layout size

Backgrounds and Images

- Do NOT use CSS gradients
Do NOT use background-image on div elements
For slide backgrounds, use a real <img> element as background
Solid background colors on a dedicated shape/div element

Text Elements

- p, h1–h6, ul, ol, li must NOT have background, border, or shadow
Inline elements (span, b, i, u, strong, em) must NOT have margins
Do NOT use manual bullet symbols — use <ul> or <ol> lists
Do NOT leave raw text directly inside div — wrap in text tags

SVG and Text

- Do NOT place text (<span>, <p>) as overlay on SVG — it will be lost in PPTX
Text on SVG shapes must use <text> element inside the SVG
SVG <text> must use text-anchor="middle" and INLINECODE155

Placeholders

- Elements with class placeholder must have non-zero width and height

Appendix G — Page Number Badge (REQUIRED)

All slides except Cover Page MUST include a page number badge. Shows current slide number in bottom-right corner.

- Position: INLINECODE157
Must use SVG (text inside <text>, not overlaid <span>)
Colors from palette only; keep it subtle; same style across all slides
Show current number only (e.g. 3 or 03), not "3/12"

CODEBLOCK23

No Excessive Whitespace (MANDATORY CHECK)

Every page must be information-dense. Avoid large empty areas.

Check	Requirement
Content Coverage	At least 70% of the content area must contain meaningful content
Gap Size

No single empty gap larger than 1" (52px) in any direction |
| Zone Balance | All 4+ zones should have substantial content, not filler |

During page verification, check for:

- Large empty margins between zones
Sparse content zones (single bullet point only)
Unbalanced layouts (one zone full, others empty)
Content that could be expanded to fill space

Slide Page Type Classification

Classify every slide as exactly one of these 5 page types:

1. Cover Page — Opening + tone setting
Table of Contents — Navigation + expectation setting (3–5 sections)
Section Divider — Clear transitions between major parts
Content Page — Data-rich slides (pick a subtype)
Summary / Closing Page — Wrap-up + action

Common Mistakes to Avoid

- Don't repeat the same layout — vary columns, cards, and callouts across slides
Don't center body text — left-align paragraphs and lists; center only titles
Don't skimp on size contrast — titles need clear differentiation from body text
Don't use colors outside the palette — strictly use provided color values
Don't mix spacing randomly — choose consistent gaps
Don't create text-only slides — add charts, data tables, or visual elements
Don't forget text box padding — account for padding when aligning shapes with text
Don't use low-contrast elements — icons AND text need strong contrast against background
NEVER use accent lines under titles — hallmark of AI-generated slides; use whitespace instead
NEVER use rounded corners — all elements must have INLINECODE162
NEVER skip source citations — every data slide needs a footer citation
NEVER exceed 2 accent colors per page (except multi-series charts)
NEVER use generated images for decoration — SVG charts only

Verification Workflow (MANDATORY for Every Slide)

After generating each slide's HTML, verify using screenshots:

1. Layout Structure: Correct header/insight/content/footer zones
Text Overflow/Truncation: No text cut off, no "..." truncation
Whitespace: No large empty gaps, 70%+ fill rate, check right side and bottom
Accent Colors: Count ≤2 (excluding base colors)
Content Variety: Not all bullet points
Square Corners: No border-radius anywhere
Source Citation: Footer citation present on data slides
Page Number Badge: Present on all non-cover slides

If ANY issue is found, FIX immediately before proceeding to the next slide.

麦肯锡风格多页演示文稿生成器

概述

本技能可生成专业麦肯锡咨询风格的HTML幻灯片。每份演示文稿均以数据驱动、信息密集且视觉严谨。工作流程涵盖端到端生成：研究→规划→幻灯片创建（封面、内容、章节分隔页、目录、总结）→部署。所有幻灯片均渲染为包含内联SVG图表的静态HTML——除极少数数据驱动的情况外，不生成任何图片。

工作流程（强制顺序——不可跳过步骤）

步骤1：研究阶段（关键——务必先做）

切勿跳过此步骤。数据质量决定演示文稿质量。

在创建任何幻灯片之前，收集全面的数据：

研究目标

- 市场规模、复合年增长率、增长率
公司指标和里程碑
竞争对手分析和市场份额
图表的历史趋势数据
带有来源引用的已验证统计数据

信息来源优先级

层级	来源类型	示例
1	官方数据/API	公司文件、政府数据库、中央银行
2

搜索策略

执行多次针对性搜索：

1. [主题] 市场规模 2025
[主题] 行业报告
[公司] 营收增长 2025
[主题] 竞争对手市场份额
[主题] 趋势预测 2026
[公司] 创立历史里程碑
[主题] 复合年增长率
[主题] 区域分布

数据质量要求

对于收集的每条数据，记录：

1. 具体数据点（数字、百分比、事实）
来源名称（机构）
发布日期或数据日期
原始URL

完成研究前的强制最低要求：

- [ ] 至少15个具体统计数据/数据点
[ ] 至少5个不同来源
[ ] 每个计划内容幻灯片的数据
[ ] 至少1个图表的历史趋势数据
[ ] 竞争对手对比数据
[ ] 以PPT格式呈现的适当来源引用

避免：

- ❌ 无来源的主张
❌ 过时数据（快速变化行业超过2年）
❌ 模糊的定性陈述（显著增长）
❌ 单一来源的关键事实

研究输出格式

研究总结

主题：[主题名称]

研究日期：[当前日期]

幻灯片N：[幻灯片标题]

关键数据点：

1. [数据点1] - [数值]
[数据点2] - [数值]

图表数据（如适用）：

年份	数值	同比增长
2023	$XX	+XX%
2024

$XX | +XX% |
| 2025 | $XX | +XX% |

来源引用： 来源：[机构1]、[机构2] | [日期]

所有来源

#	来源名称	类型	日期	URL	可靠性
1	[名称]	[报告/新闻/官方]	[日期]	[URL]	高/中

步骤2：演示文稿规划

基于研究发现，规划幻灯片结构：

- 默认：10张幻灯片（除非用户另有说明）
推荐结构：封面 → 内容页 → 总结
章节分隔页为可选——仅当内容自然分为不同章节时包含
对于大多数演示文稿，简单的封面 + 内容 + 总结结构更佳

典型的10张幻灯片结构：

- 幻灯片1：封面页
幻灯片2–9：带有数据可视化的内容页
幻灯片10：总结/结论

步骤3：生成封面页

- 不允许生成图片
不允许图形元素（形状、图标、装饰）
仅使用纯色或微妙的渐变
居中排版是主要视觉元素
优雅、克制、专业

参见下方封面页规范。

步骤4：生成内容页

对于每张内容幻灯片：

- 每页至少4个不同的内容区域
白色背景为强制默认（80%以上的幻灯片）
仅SVG图表——不生成图片
在页脚包含来源引用

参见下方内容页规范。

步骤5：生成可选页面

如果需要，生成：

- 目录（参见目录规范）
章节分隔页（参见章节分隔页规范）
总结/结束页（参见总结页规范）

步骤6：部署

使用deployhtmlpresentation部署完成的演示文稿。

设计系统

核心设计理念

专业与严肃：所有演示文稿必须方正、正式且适合商业用途。这是咨询类演示文稿，而非创意作品集。

数据驱动：每张内容幻灯片必须有可验证的数据支持，并带有适当的来源引用。

信息密度：内容页应最大化信息密度，每张幻灯片至少包含4个不同的内容区域。

风格：锐利而紧凑——方角、高信息密度、专业严谨。所有元素使用border-radius: 0。

色彩系统

主色

元素	颜色名称	十六进制	用途
主背景	白色	#FFFFFF	主要幻灯片背景（强制默认）
标题栏/页眉

深海军蓝 | #0B1F3A | 顶部标题栏（0.6英寸高） | | 主要强调色 | 钴蓝色 | #1B5AB5 | 主要图表系列、强调元素、洞察文本 | | 正文文本/标签 | 深灰色 | #2D2D2D | 主要正文文本、数据标签 | | 次要文本/脚注 | 中灰色 | #8C8C8C | 次要文本、脚注、来源 | | 网格线/分隔线 | 浅灰色 | #E0E0E0 | 图表网格线、分隔线 |

封面页和章节分隔页背景颜色（选择一种）

选项	十六进制代码	效果	文本颜色
白色	#FFFFFF	干净、简约、现代	海军蓝 #0B1F3A
海军蓝

#0B1F3A | 专业、权威 | 白色 #FFFFFF | | 钴蓝色 | #1B5AB5 | 大胆、自信 | 白色 #FFFFFF | | 青色 | #2E8BC0 | 清新、创新 | 白色 #FFFFFF | | 翡翠绿 | #3AAF6C | 增长、可持续 | 白色 #FFFFFF | | 灰色 | #4A4A4A | 中性、精致 | 白色 #FFFFFF |

渐变选项（仅限封面/分隔页，仅限微妙渐变）

渐变	CSS示例
海军蓝到深色	background: linear-gradient(180deg, #0B1F3A 0%, #1B3A5C 100%);
蓝色到海军蓝

background: linear-gradient(180deg, #1B5AB5 0%, #0B1F3A 100%); |

注意： 渐变仅允许在封面页和章节分隔页使用。内容页不得使用渐变。

图表数据系列颜色（按顺序使用）

系列	颜色名称	十六进制
1	钴蓝色	#1B5AB5
2

青色 | #2E8BC0 | | 3 | 琥珀金 | #D4A843 | | 4 | 珊瑚红 | #E05252 | | 5 | 翡翠绿 | #3AAF6C | | 6 | 紫灰色 | #7B6D9E |

语义颜色

用途	颜色	十六进制
正面数据	绿色	#3AAF6C
负面数据

红色 | #E05252 |

mckinsey-presentation-generator麦肯锡演示生成器

mckinsey-presentation-generator

McKinsey-Style Multi-Page Presentation Generator

Overview

Workflow (MANDATORY ORDER — No Skipping Steps)

Step 1: Research Phase (CRITICAL — DO FIRST)

Research Objectives

Information Source Prioritization

Search Strategy

Data Quality Requirements

Research Output Format

Step 2: Presentation Planning

Step 3: Generate Cover Page

Step 4: Generate Content Pages

Step 5: Generate Optional Pages

Step 6: Deployment

Design System

Core Design Philosophy

Color System

Primary Colors

Cover Page & Section Divider Background Colors (Choose ONE)

Gradient Options (Cover/Divider pages ONLY, subtle only)

Chart Data Series Colors (use in order)

Semantic Colors

⚠️ Accent Color Limit (STRICTLY ENFORCED — MAX 2 PER PAGE)

Alternative Color Schemes

Typography

Font Family

Typography Hierarchy

Font Size Limits (STRICT)

Forbidden Elements (DO NOT USE)

Required Style Attributes

Source Citation Format (MANDATORY)

Image Generation Rules (STRICT)

Slide Types

Cover Page

ALLOWED Elements

FORBIDDEN Elements

Layout

Font Size Hierarchy (Cover)

Cover HTML Example

Cover Verification Checklist

Content Page

1. Header Bar

2. Insight Zone

3. Content Area

4. Footer Zone (MANDATORY SOURCE CITATION)

⚠️ 4-Zone Minimum Layout (MANDATORY)

2x2 Grid

1+3 Layout

Content Variety (NOT JUST BULLETS)

Content Subtypes

Content Page Verification Checklist

Table of Contents

Layout Options

Font Size Hierarchy (TOC)

Content Elements

Section Divider

ALLOWED Elements

FORBIDDEN Elements

Layout

Font Size Hierarchy (Section Divider)

Summary / Closing Page

Layout Options

Font Size Hierarchy (Summary)

Chart & Data Visualization Rules (MANDATORY)

General Chart Rules

Bar/Column Chart

Line Chart

Progress Bar (NO ROUNDED CORNERS)

Pie Charts — Image Generation Tool is MANDATORY

HTML Implementation Specification

Appendix A — Responsive Scaling Snippet (REQUIRED)

Appendix B — CSS Rules (REQUIRED)

⚠️ Inline-Only CSS

⚠️ Background on .slide-content Directly

⚠️ No Bold for Body Text and Captions

Appendix C — Color Palette Rules (REQUIRED)

Appendix D — SVG Conversion Constraints (CRITICAL)

Supported SVG Elements (WHITELIST)

`<path>` Command Restrictions (CRITICAL)