CLI Demo Generator
Generates professional animated CLI demos as GIFs using VHS terminal recordings.
Install
npx skills add daymade/claude-code-skills --skill cli-demo-generator -g -a claude-code -y- Repository
- daymade/claude-code-skills1.5k
- Category
- Writing
- Updated
- 3d ago
- License
- MIT
- Context cost
- Mediumabout 1,610 tokens
- Runs scripts
- Yes, review before use
What it does
Generates professional animated CLI demos as GIFs using VHS terminal recordings. Use to create terminal demos, record CLI workflows as GIFs, generate animated documentation, build demo tapes for README files, or showcase any command-line tool visually: record terminal / VHS tape / demo GIF / animate my CLI.
CLI Demo Generator
Create professional animated CLI demos. Four approaches, from fully automated to pixel-precise manual control.
Quick Start
Simplest path, give commands, get GIF:
python3 ${CLAUDE_SKILL_DIR}/scripts/auto_generate_demo.py \
-c "npm install my-package" \
-c "npm run build" \
-o demo.gif
Self-bootstrapping demo, for repeatable recordings that clean their own state:
python3 ${CLAUDE_SKILL_DIR}/scripts/auto_generate_demo.py \
-c "npm install my-package" \
-c "npm run build" \
-o demo.gif \
--bootstrap "npm uninstall my-package 2>/dev/null" \
--speed 2
Critical: VHS Parser Limitations
VHS Type strings cannot contain $, \", or backticks. These cause parse errors:
# FAILS, VHS parser rejects special chars
Type "echo \"hello $USER\""
Type "claude() { command claude \"$@\"; }"
Workaround: base64 encode the command, decode at runtime:
# 1. Encode your complex command
echo 'claude() { command claude "$@" 2>&1 | grep -v "noise"; }' | base64
# Output: Y2xhdWRlKCkgey4uLn0K
# 2. Use in tape
Type "echo Y2xhdWRlKCkgey4uLn0K | base64 -d > /tmp/wrapper.sh && source /tmp/wrapper.sh"
This pattern is essential for output filtering, function definitions, and any command with shell special characters.
Approaches
1. Automated Generation (Recommended)
python3 ${CLAUDE_SKILL_DIR}/scripts/auto_generate_demo.py \
-c "command1" -c "command2" \
-o output.gif \
--title "My Demo" \
--theme "Catppuccin Latte" \
--font-size 24 \
--width 1400 --height 600
