cli-demo-gif

Generate terminal demo GIFs from VHS tape files.

14|5|Updated Jun 3, 2025
One-click install
npx skills add https://github.com/b-open-io/prompts --skill cli-demo-gif
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: cli-demo-gif
Source: https://github.com/b-open-io/prompts/tree/main/user/.claude/skills/cli-demo-gif
Command: npx skills add https://github.com/b-open-io/prompts --skill cli-demo-gif

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Creating polished terminal demos for documentation is time-consuming. This Skill streamlines the process by leveraging VHS to record terminal interactions into ready-to-share GIFs.

Core Features & Use Cases

  • Terminal recording: Create GIFs from command-line sessions with your preferred theme.
  • Configurable tapes: Use tape file structure to ensure consistent demos.
  • Documentation-ready outputs: Generate demos for README and docs with minimal setup.

Quick Start

Install VHS:

  • brew install vhs Create a tape in docs/demo/
  • Tape file structure:
    • Output docs/demo/demo.gif Run VHS:
  • vhs docs/demo/cli.tape

Frequently Asked Questions about cli-demo-gif

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create terminal GIFs for documentation?

Create terminal GIFs by writing a VHS tape file that scripts command sequences, outputs, and timing, then run VHS to render the tape into a shareable GIF. Store tape files in docs/demo/ and configure output paths, shell, fonts, themes, and typing speed within the tape.

What is VHS and how does it generate demo GIFs from CLI sessions?

VHS is a terminal recording tool that converts tape files—scripts defining commands, delays, and display settings—into polished GIFs. It captures command sequences and output rendering with configurable themes and fonts to produce documentation-ready demos.

Can I use terminal GIFs in README files and published documentation?

Yes, VHS-generated GIFs are designed specifically for README and documentation contexts. They render CLI interactions as standard GIF files that embed directly into markdown and HTML docs without external dependencies.

What tape file commands do I need to configure terminal recording and output?

VHS tape files support Output, Set Shell, Set FontSize, Set Width, Set Height, Set Padding, Set Theme, Set TypingSpeed, Type, Enter, Sleep, Hide, and Show commands. These control GIF destination, rendering style, command execution, and timing to produce consistent polished demos.

Do I need to install tools before creating terminal demo GIFs?

Yes, install VHS (via brew install vhs or your package manager) before running tape files. VHS is the only required dependency; create tape files in plain text and execute vhs docs/demo/cli.tape from the command line.

What are the limitations of using terminal GIFs for CLI documentation?

GIFs are static recordings—they cannot capture interactive user input or real-time output beyond what the tape script defines. Large, complex sessions may produce larger file sizes; consider tape length and visual complexity when designing demos.