How to use the Capsule HTML Deck Template agent skill

What the skill makes the agent do

An agent skill is a folder of instructions and files that an AI agent can load when a task matches it. This one is aimed at a year-end self-review for a product manager. When you ask, the agent fills the Capsule template with your own content: your role, outcomes, learning and requests.

The skill is built to keep the template intact. The source says the agent should not swap fonts, recolour the palette, restructure the layout grid or remove decorative elements such as corner brackets, paper grain, geometric shapes and illustrated SVGs. Before drafting, the agent asks for missing details such as audience, decision goal and key numbers, then proposes a slide plan and written slides.

• Output: a single self-contained HTML deck
• Content: role, outcomes, learning and the ask, backed by evidence you provide
• Style: modular pill cards, warm bone background, pastel palette
• Files in the skill: example.html, SKILL.md and template.json

Install the Capsule skill from the ZIP download

Download the skill as a ZIP file from the agent-skills directory page. Unzip it so the skill folder ends up in one of these locations:

Use ~/.claude/skills/ to make the skill available across your projects, or use .claude/skills/ inside a specific project folder to limit it to that project. The skill folder should contain SKILL.md, example.html and template.json.

If you use the Claude apps instead of a folder, you can upload the skill under Settings → Capabilities → Skills.

• Option A: unzip into ~/.claude/skills/ for personal use
• Option B: unzip into a project's .claude/skills/ folder for one project
• Option C: upload the skill in the Claude apps under Settings → Capabilities → Skills

Trigger the skill with a natural request

You do not need a special command. The skill is matched by its tags and triggers, which include career, promotion, self-review, portfolio, html deck and html slides. Describe what you want in plain language and name the format you need.

The skill's own example prompt shows the level of detail that works well: the subject, the audience (manager and review committee), and a request for a decision-grade career deck in the template's visual system.

• 'Make an HTML deck for my year-end self-review as a product manager. The audience is my manager and the review committee.'
• 'Build an html slides version of my promotion case in the Capsule style.'
• 'Help me write my career portfolio as an html deck, starting with the questions you need answered.'

Give the agent your materials

The agent asks first for the essentials it lacks: audience, decision target, source-of-truth materials, deadline and the numbers that must stay exactly as you state them. Having these ready speeds up the first draft.

The skill's review rubric asks whether the evidence makes the claim feel earned. Bring real outcomes with the data behind them, rather than general descriptions. The agent replaces placeholder content with your headlines, body copy, numbers, names, dates and section labels.

• Your role and scope
• Key outcomes with the numbers that back them
• What you learned over the year
• Specific requests or the decision you want from the reviewer
• Any images, matched to the existing placeholder sizes

Check and adjust the deck

The skill changes deck length by duplicating or removing existing layouts. If you need more slides, the agent copies a slide with the most suitable layout. If you need fewer, it drops slides from the end and updates the page-number labels.

The output is raw HTML. Open the file in a browser to review it. The skill does not provide a way to edit it in conventional slide software, so plan any late changes as HTML edits.

• Open the HTML file in a browser to preview it
• Check every number against your source records
• Confirm that page-number labels match the final slide count
• Keep the navigation script in the file as shipped

Safety notes: scripts, network and licence

According to the listing, this skill does not run scripts and does not use the network. It lists no requirements. Its design-system requirement is also set to false.

The upstream template is MIT-licensed, and the skill is listed under Apache-2.0. SKILL.md says the full upstream MIT licence text, with its copyright notice, must be redistributed with any copy of example.html, template.json or any vendored assets. The file list for this skill does not show a LICENSE file, so check the download for it before you redistribute the files.

• Runs scripts: no
• Uses network: no
• Requirements listed: none
• Keep the upstream MIT notice if you copy or share the template files