What You'll Build

Gemini CLI is Google's command-line AI agent — a powerful way to interact with Gemini models directly from your terminal. With the html-slides skill installed, you can generate polished HTML presentations by describing what you want in plain English. The output is a single self-contained HTML file with all CSS and JS inline. No dependencies, no build steps, no design skills required.

Install the Skill

Option 1 — Quick install (recommended):

Bash
curl -sSL https://raw.githubusercontent.com/bluedusk/html-slides/main/remote-install.sh | bash

This detects your installed AI agents and sets up the skill automatically. Gemini CLI will be configured out of the box.

Option 2 — Manual setup:

Bash
# User-level (all projects)
ln -s /path/to/html-slides ~/.gemini/skills/html-slides

# Project-level (this project only)
ln -s /path/to/html-slides .gemini/skills/html-slides

User-level installation means the skill is available across every project you open with Gemini CLI. Project-level keeps it scoped to a single repo.

Generate Slides

Open your terminal, launch Gemini CLI, and invoke the skill with a prompt. Here are three practical examples:

Example 1 — Product launch

Prompt
/html-slides Create a product launch presentation for our mobile app. Highlight: 3 key features with flip cards, download stats with animated counters, and a roadmap timeline for the next 6 months.

Example 2 — Workshop material

Prompt
/html-slides Build a 12-slide workshop on GraphQL. Start with "Why GraphQL" as a comparison table (REST vs GraphQL), show a code block with a basic query, an architecture flow for the request lifecycle, and end with expandable cards for common patterns.

Example 3 — From meeting notes

Prompt
/html-slides I have meeting notes in standup-notes.md. Turn them into a clean 5-slide summary for the leadership team. Use stats cards for the key metrics mentioned.

Each prompt generates a complete, ready-to-present HTML file. The skill picks the right interactive components — flip cards, charts, timelines, stats cards — based on your description.

Choose a Theme

HTMLSlides supports two modes. Advanced mode (the default) uses structured interactive components with built-in themes like Dark Interactive and Excalidraw. Simple mode lets the AI create a unique visual design tailored to your content.

To use simple mode, just say "simple" or describe the aesthetic you're after:

Prompt
/html-slides Create a simple presentation about sustainable design. I want it to feel calm and modern.

In simple mode, the skill generates 3 style previews so you can pick the look that fits before the full deck is built.

Tips for Gemini CLI

  1. Point it at existing files — Gemini CLI can read files in your current directory. Reference your docs, READMEs, CSV data, or Markdown notes directly in your prompt and the skill will extract content from them.
  2. Use user-level installation — Install the skill in ~/.gemini/skills/ so it's available across every project without repeating setup.
  3. Chain requests to refine — Generate a deck, review it, then follow up: "add a chart showing monthly growth to slide 4" or "swap the timeline on slide 6 for a Kanban board." Gemini CLI keeps context across turns.
  4. Universal skills path — The skill also supports the ~/.agents/skills/ directory from the Agent Skills standard, so it works with any compatible coding agent.

Open and Present

Double-click the generated .html file to open it in any browser — it works offline, no server needed. Use arrow keys, Space, Home, and End to navigate.

For the full presenter experience, open the file in the HTMLSlides desktop app. You get dual-display mode (presenter dashboard on your laptop, clean audience view on the projector), speaker notes, a countdown timer, and a real-time laser pointer. Check the documentation for setup details.