# SVG Icon Library

This directory provides **6700+ high-quality SVG icons** across three libraries that can be directly embedded into SVG files generated by PPT Master.

## Libraries

| Library | Style | Count | viewBox | Prefix |
|---------|-------|-------|---------|--------|
| `chunk` | fill · straight-line geometry (sharp corners, rectilinear) | 640 | `0 0 16 16` | `chunk/` |
| `tabler-filled` | fill · bezier-curve forms (smooth, rounded contours) | 1000+ | `0 0 24 24` | `tabler-filled/` |
| `tabler-outline` | stroke / line | 5000+ | `0 0 24 24` | `tabler-outline/` |

---

## Usage

Use placeholder syntax **during SVG generation**:

```xml
<!-- chunk (sharp, geometric — tech/engineering/enterprise tone) -->
<use data-icon="chunk/home" x="100" y="200" width="48" height="48" fill="#0076A8"/>

<!-- tabler-filled (rounded, organic — lifestyle/health/home tone) -->
<use data-icon="tabler-filled/home" x="100" y="200" width="48" height="48" fill="#0076A8"/>

<!-- tabler-outline (light, line-art — refined screen-only showcases) -->
<use data-icon="tabler-outline/home" x="100" y="200" width="48" height="48" fill="#0076A8"/>
```

**Attributes**:
- `data-icon` — `<library>/<icon-name>` (filename without `.svg`)
- `x`, `y` — Position
- `width`, `height` — Size (recommend 32–48px for legibility)
- `fill` — Color

`finalize_svg.cjs` auto-embeds all placeholders during post-processing. To run manually:

```bash
python3 scripts/svg_finalize/embed_icons.py svg_output/*.svg
```

---

## Searching for Icons

Use `ls | grep` — zero token cost:

```bash
ls skills/ppt-master/templates/icons/chunk/ | grep home
ls skills/ppt-master/templates/icons/tabler-filled/ | grep home
ls skills/ppt-master/templates/icons/tabler-outline/ | grep chart
```

---

## Style Rules

**No default library — actively choose based on content tone.** Read the source material first, judge its character, then lock a library. Each library's visual language suits a different kind of content:

- **`chunk`** — **fill** style, built from straight-line commands only (M/L/H/V/Z); sharp, precise angles; structured and highly legible.
- **`tabler-filled`** — **fill** style, built from bezier curves and arcs (C/A); smooth, rounded, organic contours — warmer and softer in tone.
- **`tabler-outline`** — **stroke** style (line art); airy and refined.

> `chunk` and `tabler-filled` are both filled — the real distinction is **straight-line vs. curved** geometry. `tabler-outline` is the only stroke-based library.

**One presentation = one library.** Pick a library at the start and use it exclusively throughout. If the chosen library doesn't have an exact icon, find the closest available alternative within that same library — never cross libraries to fill a gap.

| Content tone | Recommended library |
|--------------|---------------------|
| Tech / engineering / enterprise / data | `chunk` |
| Lifestyle / health / home / wellness | `tabler-filled` |
| Light, refined, minimal showcases (screen-only) | `tabler-outline` |

> The table above is a reference, not a hard rule. When content tone doesn't cleanly match a row, pick the library whose visual character best serves the deck and document the choice.

⚠️ Do **not** mix icons from different libraries in the same presentation — pick one and use it consistently throughout.
