Skip to main content
ClaudeWave
ES, Spanish
Skill70.1k estrellas del repoactualizado 5d ago

export-as-pptx-screenshots

Flat images — pixel-perfect but not editable

Instalar en Claude Code
Copiar
git clone --depth 1 https://github.com/asgeirtj/system_prompts_leaks /tmp/export-as-pptx-screenshots && cp -r /tmp/export-as-pptx-screenshots/Anthropic/claude-design/skills/export-as-pptx-screenshots ~/.claude/skills/export-as-pptx-screenshots
Después abre una sesión nueva de Claude Code; el skill carga automáticamente.

SKILL.md

# Export as PPTX (screenshots)

Export an HTML slide deck to a `.pptx` as full-bleed PNG images. Pixel-perfect, not editable. One `gen_pptx` tool call.

### Steps

1. `show_to_user` the deck.
2. Call `gen_pptx`:

```jsonc
{
  "mode": "screenshots",
  "width": 1920, "height": 1080,
  "slides": [
    { "showJs": "goToSlide(0)", "selector": "body" },  // selector unused in screenshot mode but required
    { "showJs": "goToSlide(1)", "selector": "body" }
  ],
  "hideSelectors": [".nav", ".progress"],
  // If the deck wraps slides in a transform:scale() container, name it here so
  // the deck is forced to width × height inside the locked iframe.
  "resetTransformSelector": ".slide-container",
  "filename": "my-deck"
}
```

If — and only if — the user asked for Google Slides, also pass `"offer_google_slides": true`: the export dialog gains a 'Send to Google Slides' button, and the upload happens only if they click it.

`slides[].delay` defaults to 600ms — bump if transitions are slower.

#### If the deck uses the `<deck-stage>` starter component

- `resetTransformSelector: "deck-stage"` — same as editable mode; the component drops its shadow-DOM `transform: scale()` so the slides fill the locked iframe.
- `slides[N].showJs`: `"document.querySelector('deck-stage').goTo(N)"` — 0-indexed, so slide 1 is `goTo(0)`.
- `hideSelectors` is unnecessary — the overlay and tap-zones live in shadow DOM and aren't captured.

### Validation

Same flags as editable mode. Watch for `duplicate_adjacent` (showJs didn't navigate) and `reset_selector_miss` / `slide_size_mismatch` (your `resetTransformSelector` matched nothing or didn't size to width × height).

Speaker notes from `#speaker-notes` are attached automatically. Page reloads after.
3d-objectSkill

three.js model, downloadable as OBJ or GLB

animated-videoSkill

Timeline-based motion design

artifact-capabilitiesSkill

Runtime capabilities a published Artifact page can be granted — behavior static HTML cannot provide on its own, such as the page reading live or connected data, remembering what people do on it (a poll, a sign-up sheet, a checklist, a document edited in place — it saves new versions of itself), keeping state shared across viewers, knowing who is viewing, asking Claude a question of its own, storing files people add, or handing the viewer a file to save. Serves this user's live capability roster and the typed call definitions. Load it whenever the user asks for an artifact needing any such runtime behavior.

artifact-designSkill

Design guidance and fundamentals for Artifacts.

artifact-diagrammingSkill

Diagramming know-how for Artifacts - when a picture earns its place, how to draw one that shows the real mechanism, and the inline-SVG mechanics that keep it legible in both themes.

batchSkill

Research and plan a large-scale change, then execute it in parallel across 5–30 isolated worktree agents that each open a PR.

claude-api-in-prototypesSkill

Call Claude from your HTML artifacts via window.claude.complete

claude-in-chromeSkill

Automates your Chrome browser to interact with web pages - clicking elements, filling forms, capturing screenshots, reading console logs, and navigating sites. Opens pages in new tabs within your existing Chrome session. Requires site-level permissions before executing (configured in the extension).