Mckinsey Style Visualization Skill — Design skill for Claude Code
Agent Skill that turns messy notes into rendered strategy-consulting visuals, with SVG examples and validation.
How to install Mckinsey Style Visualization Skill
This entry records only its repository, not the path inside it, so there is no
exact command to give. Open kgraph57/mckinsey-style-visualization-skill and copy the folder into
~/.claude/skills/, or the file into ~/.claude/agents/.
What Mckinsey Style Visualization Skill does
Agent Skill that turns messy notes into rendered strategy-consulting visuals, with SVG examples and validation.
Alternatives in Design
- Export Diagram — Export a diagram-design HTML file to .svg and .png next to the source 27.2k ★
- Weather Orchestrator Command — Fetch the current temperature for Dubai, UAE and create a visual SVG weather card 20.2k ★
- Brainstorm Experiments New — Design lean pretotypes for new product validation 7.8k ★
README
Strategy Consulting Visualization Skill
**Messy notes in. Board-ready slides out.**
One skill for your AI agent: turn notes, metrics, and prose into consulting-grade visuals — as real SVG slides, as an **animated HTML deck**, or as a spec any designer or tool can execute.
Core SVG/HTML generation uses the Python 3 standard library only. **No API key or network access required.** Automated PDF export has optional browser dependencies.
[](LICENSE) [](https://github.com/kgraph57/mckinsey-style-visualization-skill/actions/workflows/ci.yml) [](SKILL.md) [](https://github.com/kgraph57/mckinsey-style-visualization-skill/releases/tag/v2.4.0)
English | [日本語](README.ja.md)

_An actual deck built by this repo: `specs (JSON) → SVG slides → animated HTML deck`. Nothing hand-drawn._ _Reproduce it: `python3 scripts/scaffold_deck.py board-update -o demo && python3 scripts/build_html_deck.py --manifest demo/deck.json -o demo/deck.html`_
What’s new — September 8, 2026
- Refined business slides and diagrams. Updated the executive summary, growth waterfall, priority matrix, process flow and roadmap layouts, with clearer hierarchy, labels and decision cues. Regenerated the English and Japanese landing decks and site previews from the current renderer.
- Real deliverables on the site. The homepage now shows actual slide previews alongside a complete A4 brief, with links to the finished PDFs. Examples use illustrative business data.
- HTML first, PDF for sharing. Keep chart data in JSON and report prose in Markdown, refine the generated HTML, then export it direct
Related Skills
Gongnangi Chart Skill
Claude Code skill: McKinsey/Bain consulting-style HTML chart generator with Chrome headless PNG export
Keynote Create
Claude Code skill: turn source material into a styled presentation deck — image-led Keynote or Minto/McKinsey
Wb Chronicler
Tolkien-style chronicle for WorldBox playthroughs — Claude Code turns saves into narrative chapters, rendered
Spotkit
Spotkit — a Claude Code skill that turns a feature description into minimal, abstract SVG product illustration
Brain Quick Wiki
Generate the Wikipedia-style static site from the vault — the quick-win visualization
03 My Brand Visuals
Capture the visual identity as an editable recipe — colours, type, imagery style, and what to never generate —
Related Agents
Mckinsey Slide Agent
McKinsey-style slide deck composer. Use proactively when the user asks to build, draft, design, or "make a dec
Deck Builder
Use this agent when you need to create a McKinsey-style presentation deck for a course or teaching purpose, es
Nitpicker
Hyper-critical style and hygiene reviewer — flags every instance of messy code with no severity filter. Use fo