# Slides

> Use when create strategic HTML presentations with Chart.js, design tokens, responsive layouts, copywriting formulas, and contextual slide strategies.

- Skill: `oyi77/slides` (Agent Skill, multi-file: 6 files)
- Install (CLI): `npx skillmds add oyi77/slides`
- Raw SKILL.md: https://api.skillmd.com/api/skills/oyi77/slides/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- License: MIT
- Author: oyi77 (https://skillmd.com/u/oyi77)
- Updated: 2026-09-08
- Page: https://skillmd.com/skills/oyi77/slides

---



# Slides

Strategic HTML presentation design with data visualization.

## When to Use

- Marketing presentations and pitch decks
- Data-driven slides with Chart.js
- Strategic slide design with layout patterns
- Copywriting-optimized presentation content

## Workflow

1. **Plan** — Define presentation goal, audience, and slide count
2. **Structure** — Select strategy from slide-strategies.csv
3. **Design** — Generate layouts, typography, colors from decision CSVs
4. **Build** — Create HTML slides with Chart.js and design tokens
5. **Validate** — Check token compliance and pattern breaking
6. **Present** — Export and deliver presentation

## Subcommands

| Subcommand | Description | Reference |
|------------|-------------|-----------|
| `create` | Create strategic presentation slides | `references/create.md` |

## References (Knowledge Base)

| Topic | File |
|-------|------|
| Layout Patterns | `references/layout-patterns.md` |
| HTML Template | `references/html-template.md` |
| Copywriting Formulas | `references/copywriting-formulas.md` |
| Slide Strategies | `references/slide-strategies.md` |

## Routing

1. Parse subcommand from `$ARGUMENTS` (first word)
2. Load corresponding `references/{subcommand}.md`
3. Execute with remaining arguments

