dokie-ai-ppt — Claude Code skill: HTML slides from a chat
This skill turns a conversation with your agent into an HTML deck: it collects requirements, drafts an outline, picks a theme and writes the slides.
npx skills add MYZY-AI/dokie-ai-ppt --skill dokie-ai-ppt -a claude-codeWhat dokie-ai-ppt does
The skill runs a project step by step. It collects requirements, then picks a theme, generates the outline, and only after that writes HTML. At every stage the agent shows the result and waits for your reply, and it reads the rule files under rules/ first — themes, slides, charts, animation. Slides land in a folder as slide_01.html, slide_02.html and so on.
The specs are fixed: 1280 × 720, charts on Chart.js 4.5, icons from Font Awesome 6.5, animation only through GSAP, since CSS animation is prohibited. Emoji and invented image URLs are off the table too, and images come only from what you upload or the tool fetches. Chart data cannot be made up.
Check the CLI before you start: npx dokie-cli themes. If that command fails, nothing downstream will build. Local preview runs with npx dokie-cli preview ./my-project/. Edits have their own path — the agent works out your intent, changes as little as possible and keeps the original layout.
What it helps with
- turn a chat brief into a slide deck
- draft an outline before any HTML is written
- switch theme colors or fonts
- drop a funnel, timeline or chart onto a slide
- preview the finished slides locally
Example prompts for the agent
- build a deck for the quarterly report, keep it formal
- add a sales funnel slide after the third one
- change the theme colors to dark blue and regenerate the slides
How to install dokie-ai-ppt
1Skills CLI (Vercel)
npx skills add MYZY-AI/dokie-ai-ppt --skill dokie-ai-ppt -a claude-code2Manually: put the files in place
~/.claude/skills/dokie-ai-ppt/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/dokie-ai-ppt/
1Skills CLI (Vercel)
npx skills add MYZY-AI/dokie-ai-ppt --skill dokie-ai-ppt -a codex2Manually: put the files in place
.agents/skills/dokie-ai-ppt/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add MYZY-AI/dokie-ai-ppt --skill dokie-ai-ppt -a cursor2Manually: put the files in place
.cursor/skills/dokie-ai-ppt/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install MYZY-AI/dokie-ai-ppt dokie-ai-ppt2Manually: put the files in place
.github/skills/dokie-ai-ppt/SKILL.md1Skills CLI (Vercel)
npx skills add MYZY-AI/dokie-ai-ppt --skill dokie-ai-ppt -a gemini-cli2Platform CLI
gemini skills install https://github.com/MYZY-AI/dokie-ai-pptManually: put the files in place
.devin/skills/dokie-ai-ppt/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add MYZY-AI/dokie-ai-ppt --skill dokie-ai-ppt -a opencodeClaude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
Step by step, with commands for each platform: How to install skills in Claude Code: five ways
Questions about dokie-ai-ppt
How do I install dokie-ai-ppt in Claude?
Run npx skills add MYZY-AI/dokie-ai-ppt --skill dokie-ai-ppt -a claude-code. The skill ends up at ~/.claude/skills/dokie-ai-ppt/SKILL.md.
What does dokie-ai-ppt do?
It generates HTML slides from a conversation: requirement analysis, outline, theme selection, slide files and a local preview.
What does the skill need to run?
A working CLI — verify it with npx dokie-cli themes. The same CLI lists themes and starts the preview.