Agent skill

Claude Code Deck

by hamzafarooq in hamzafarooq/claude-code-starter

Generate a complete, ready-to-share HTML presentation explaining Claude Code, Skills, Sub Agents, Hooks, and Multi-Agent Systems — designed for product managers.

MITAuto-check passedAgent Workflows

Install Claude Code Deck

skills CLI

$ npx skills add hamzafarooq/claude-code-starter --skill claude-code-deck -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI

$ gh skill install hamzafarooq/claude-code-starter claude-code-deck --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy

$ git clone --depth 1 https://github.com/hamzafarooq/claude-code-starter.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.claude/skills/claude-code-deck .claude/skills/claude-code-deck && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Paste into Claude Code

Install the "claude-code-deck" agent skill from https://github.com/hamzafarooq/claude-code-starter/tree/main/.claude/skills/claude-code-deck into .claude/skills/claude-code-deck/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "claude-code-deck", then confirm the skill loads.

Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

$skill-installer

$skill-installer install https://github.com/hamzafarooq/claude-code-starter/tree/main/.claude/skills/claude-code-deck

Type this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.

skills CLI

$ npx skills add hamzafarooq/claude-code-starter --skill claude-code-deck -a codex

Project install goes to .agents/skills/; add -g for ~/.codex/skills/.

GitHub CLI

$ gh skill install hamzafarooq/claude-code-starter claude-code-deck --agent codex

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/hamzafarooq/claude-code-starter.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.claude/skills/claude-code-deck .agents/skills/claude-code-deck && rm -rf skills-src

Use ~/.agents/skills/ instead of .agents/skills for a personal install.

Codex skills documentation · loads skills from .agents/skills/

Paste into Codex

Install the "claude-code-deck" agent skill from https://github.com/hamzafarooq/claude-code-starter/tree/main/.claude/skills/claude-code-deck into .agents/skills/claude-code-deck/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "claude-code-deck", then confirm the skill loads.

Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add hamzafarooq/claude-code-starter --skill claude-code-deck -a cursor

Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.

GitHub CLI

$ gh skill install hamzafarooq/claude-code-starter claude-code-deck --agent cursor

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/hamzafarooq/claude-code-starter.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.claude/skills/claude-code-deck .cursor/skills/claude-code-deck && rm -rf skills-src

Use ~/.cursor/skills/ instead of .cursor/skills for a personal install.

Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/

Paste into Cursor

Install the "claude-code-deck" agent skill from https://github.com/hamzafarooq/claude-code-starter/tree/main/.claude/skills/claude-code-deck into .cursor/skills/claude-code-deck/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "claude-code-deck", then confirm the skill loads.

Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

gemini skills install

$ gemini skills install https://github.com/hamzafarooq/claude-code-starter.git --path .claude/skills/claude-code-deck

--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.

skills CLI

$ npx skills add hamzafarooq/claude-code-starter --skill claude-code-deck -a gemini-cli

Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.

GitHub CLI

$ gh skill install hamzafarooq/claude-code-starter claude-code-deck --agent gemini-cli

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/hamzafarooq/claude-code-starter.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.claude/skills/claude-code-deck .gemini/skills/claude-code-deck && rm -rf skills-src

Use ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.

Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/

Paste into Gemini CLI

Install the "claude-code-deck" agent skill from https://github.com/hamzafarooq/claude-code-starter/tree/main/.claude/skills/claude-code-deck into .gemini/skills/claude-code-deck/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "claude-code-deck", then confirm the skill loads.

Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

GitHub CLI

$ gh skill install hamzafarooq/claude-code-starter claude-code-deck

Installs for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).

skills CLI

$ npx skills add hamzafarooq/claude-code-starter --skill claude-code-deck -a github-copilot

Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.

Manual copy

$ git clone --depth 1 https://github.com/hamzafarooq/claude-code-starter.git skills-src && mkdir -p .github/skills && cp -r skills-src/.claude/skills/claude-code-deck .github/skills/claude-code-deck && rm -rf skills-src

Use ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.

GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/

Paste into GitHub Copilot

Install the "claude-code-deck" agent skill from https://github.com/hamzafarooq/claude-code-starter/tree/main/.claude/skills/claude-code-deck into .github/skills/claude-code-deck/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "claude-code-deck", then confirm the skill loads.

GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add hamzafarooq/claude-code-starter --skill claude-code-deck -a opencode

OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.

GitHub CLI

$ gh skill install hamzafarooq/claude-code-starter claude-code-deck --agent opencode

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/hamzafarooq/claude-code-starter.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.claude/skills/claude-code-deck .opencode/skills/claude-code-deck && rm -rf skills-src

Use ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.

OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/

Paste into OpenCode

Install the "claude-code-deck" agent skill from https://github.com/hamzafarooq/claude-code-starter/tree/main/.claude/skills/claude-code-deck into .opencode/skills/claude-code-deck/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "claude-code-deck", then confirm the skill loads.

OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

Facts

Skill name: claude-code-deck
GitHub stars: 145
Token cost: ~972 tokens
SKILL.md length: 358 words
Files: 1
Skills in repo: 29
Repo updated: Sep 13, 2026
First seen: Oct 7, 2026
Licence: MIT

At a glance

Generate a complete, ready-to-share HTML presentation explaining Claude Code, Skills, Sub Agents, Hooks, and Multi-Agent Systems — designed for product managers.

Works in 4 steps: Copy the full HTML from… → Save as presentation.html in the working… → Open with open presentation.html or… → …
Someone wants a polished explainer deck for Claude Code concepts
SKILL.md covers What This Skill Produces, Slide Outline, Instructions and Regeneration Template, plus 2 more sections
Calls vercel

What it does

Claude Code Deck is an agent skill from hamzafarooq/claude-code-starter. Generate a complete, ready-to-share HTML presentation explaining Claude Code, Skills, Sub Agents, Hooks, and Multi-Agent Systems — designed for product managers. Outputs a single zero-dependency HTML file in Bold Signal style (dark, orange accents). Use when someone wants a polished explainer deck for Claude Code concepts.

Its SKILL.md is about 970 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Agent Workflows, covering Subagents, Slides and decks and Multi-agent orchestration. The licence is MIT.

When your agent uses it

Someone wants a polished explainer deck for Claude Code concepts
Tasks that involve Subagents
Tasks that involve Slides and decks

Example prompts

“/claude-code-deck”

Workflow steps

4 steps, taken from the first numbered list in SKILL.md.

Copy the full HTML from presentation.html in the repo root (or regenerate it using the template below).
Save as presentation.html in the working directory.
Open with open presentation.html or deploy to Vercel
Share the Vercel URL. The deck is live in under 60 seconds.

What it can do on your machine

Read from SKILL.md and the folder at commit 172c531. It shows what the files ask for, not the result of running them.

Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
Shell commands in SKILL.md call:
- vercel
From the folder's file list and the shell code blocks in SKILL.md.
Network
Links to these hosts (documentation or services it may open):
- claude-deck.vercel.app
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Claude Code Deck loads about 972 tokens when it runs. Until then it costs about 85 tokens; SKILL.md has 358 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it: ~85
When it runs · the whole SKILL.md, loaded when a task matches: ~972

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from hamzafarooq/claude-code-starter at commit 172c531, republished under its MIT licence (© hamzafarooq). 358 words, ~972 tokens.

Download SKILL.mdSave it as .claude/skills/claude-code-deck/SKILL.md (or your agent's skills folder).

name: claude-code-deck
description: Generate a complete, ready-to-share HTML presentation explaining Claude Code, Skills, Sub Agents, Hooks, and Multi-Agent Systems — designed for product managers. Outputs a single zero-dependency HTML file in Bold Signal style (dark, orange accents). Use when someone wants a polished explainer deck for Claude Code concepts.

Claude Code Deck

Generate a production-ready, 11-slide HTML presentation on Claude Code's five core primitives — targeted at product managers and non-technical audiences.

What This Skill Produces

A single presentation.html file featuring:

11 slides covering Claude Code, Skills, Sub Agents, Hooks, Multi-Agent Systems, architecture, PM use cases, and next steps
Bold Signal style: dark background (#080810), orange accents (#f5a623), geometric diagonal shapes, clean Helvetica typography
Zero dependencies: fully self-contained, works offline
Navigation: arrow keys, spacebar, click, swipe — progress bar, slide counter
Speaker notes: press N to toggle per-slide notes

Slide Outline

#	Title	Core Insight
1	Title	Ship with Claude Code
2	What is Claude Code?	AI pair programmer in your terminal — reads, edits, runs, ships
3	The PM Superpower	Hours vs. engineering weeks
4	Concept 01 — Skills	Reusable workflows triggered by a slash command
5	Skills in Action	6 real examples from the course
6	Concept 02 — Sub Agents	Delegate to specialist AI workers with isolated context
7	Concept 03 — Hooks	PreToolUse / PostToolUse / Stop / Notification
8	Concept 04 — Multi-Agent	Parallel fleets, scale beyond a single context window
9	How It All Fits	Layered architecture: Multi-Agent → Sub Agents → Skills → Hooks
10	What PMs Are Building	4 real course builds with time-to-ship
11	Your Next 3 Steps	Install → run a skill → build a multi-agent workflow

Show full SKILL.md (158 more words)Show less

Instructions

Copy the full HTML from presentation.html in the repo root (or regenerate it using the template below).
Save as presentation.html in the working directory.

Open with open presentation.html or deploy to Vercel:

bash

mkdir -p /tmp/claude-deck
cp presentation.html /tmp/claude-deck/index.html
cd /tmp/claude-deck && vercel deploy --yes

Share the Vercel URL. The deck is live in under 60 seconds.

Regeneration Template

If the user wants to rebuild or customise the deck, use frontend-slides skill with these parameters:

Topic: Claude Code — Skills, Sub Agents, Hooks, Multi-Agent Systems
Audience: Product managers and non-engineers
Slides: 11
Style: Bold Signal (dark bg #080810, orange accent #f5a623, diagonal geometric shapes, Helvetica)
Vibe: Impressed / Confident

Follow the slide outline above as the content structure. Every slide must:

Have a one-insight headline (not a topic label)
Fit entirely within 100vh — no scrolling
Use clamp() for all font sizes
Include speaker notes in data-notes attribute

Bold Signal Design Reference

css

/* Core palette */
--bg:      #080810;
--accent:  #f5a623;
--accent2: #f04e23;
--text:    #ffffff;
--muted:   rgba(255,255,255,0.5);

/* Background shape (right diagonal) */
position: absolute; top: -25%; right: -8%; width: 52%; height: 140%;
background: linear-gradient(145deg, #f5a623, #f04e23);
clip-path: polygon(22% 0%, 100% 0%, 100% 100%, 0% 100%);
opacity: 0.09;

/* Typography */
h1: clamp(2.4rem, 5.5vw, 5.2rem) — weight 900 — tracking -0.035em
h2: clamp(1.6rem, 3vw, 2.8rem)   — weight 800 — tracking -0.025em
body: clamp(0.9rem, 1.5vw, 1.15rem) — weight 300 — muted white
kicker: clamp(0.55rem, 1vw, 0.75rem) — all-caps — letter-spacing 0.32em — orange

Live Demo

Deployed at: https://claude-deck.vercel.app

Files

Just SKILL.md in .claude/skills/claude-code-deck of hamzafarooq/claude-code-starter.

Open the folder on GitHubat commit 172c531

Compare with similar skills

Claude Code Deck next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Claude Code Deck compared with similar skills
Skill	Stars	Used in	Tokens	Auto-check	Licence	Repo updated
Claude Code Deck this skillhamzafarooq/claude-code-starter	145	—	~972	Automated safety check: Pass	MIT	25 days ago
Paseo Advisor Second Opiniongetpaseo/paseo	20k	1 repos	~756	Automated safety check: Pass	Custom licence	yesterday
O2 Review Loopopenobserve/openobserve	22k	—	~3.7k	Automated safety check: Pass	AGPL-3.0	today
Kimi Code DelegationCherryHQ/cherry-studio	52k	1 repos	~504	Automated safety check: Pass	AGPL-3.0	today
Harness Agent Team Designerrevfactory/harness	9.1k	—	~4.5k	Automated safety check: Pass	Apache-2.0	10 days ago
ClawTeam Multi-Agent Swarmwin4r/ClawTeam-OpenClaw	1.5k	1 repos	~2.9k	Automated safety check: Pass	MIT	3 mo ago

Similar skills

Paseo Advisor Second Opinion
getpaseo/paseo
Launches one separate agent through Paseo to give a second opinion on the current task, with a self-contained briefing and no permission to edit files.
20k GitHub starsUsed in 1 repo~756 tokens
Agent WorkflowsAuto-check passed
O2 Review Loop
openobserve/openobserve
Splits a change into planner, coder and independent reviewer roles: you confirm a spec, a subagent implements it, and a separate reviewer checks each round's local WIP commit.
22k GitHub stars~3.7k tokensUpdated today
Agent WorkflowsAuto-check passed
Kimi Code Delegation
CherryHQ/cherry-studio
Delegates one bounded repository task to Kimi Code in non-interactive prompt mode and reads back the final result from its JSON event stream.
52k GitHub starsUsed in 1 repo~504 tokens
Agent WorkflowsAuto-check passed
Harness Agent Team Designer
revfactory/harness
Designs a project-specific agent harness: defines specialist agents, writes the skills they follow, picks an execution mode and model for each, and keeps the setup maintained.
9.1k GitHub stars~4.5k tokensUpdated 10 days ago
Agent WorkflowsAuto-check passed
ClawTeam Multi-Agent Swarm
win4r/ClawTeam-OpenClaw
Launches a swarm of specialist Hermes agents in git-worktree-isolated tmux windows with a kanban board and file-based inboxes, using built-in templates like hedge-fund and code-review.
1.5k GitHub starsUsed in 1 repo~2.9k tokens
Agent WorkflowsAuto-check passed
Sub-Agent Delegation
codewhale-hq/Codewhale
Guides when and how to split multi-step coding, research or verification work into focused sub-agent runs while the parent keeps integration and final checks.
41k GitHub stars~790 tokensUpdated yesterday
Agent WorkflowsAuto-check passed

Questions about Claude Code Deck

What does Claude Code Deck do?

Generate a complete, ready-to-share HTML presentation explaining Claude Code, Skills, Sub Agents, Hooks, and Multi-Agent Systems — designed for product managers. Claude Code Deck is an agent skill from hamzafarooq/claude-code-starter. Generate a complete, ready-to-share HTML presentation explaining Claude Code, Skills, Sub Agents, Hooks, and Multi-Agent Systems — designed for product managers.

When should I use Claude Code Deck?

Claude Code Deck fits situations like: someone wants a polished explainer deck for Claude Code concepts; tasks that involve Subagents; tasks that involve Slides and decks.

How do I install Claude Code Deck in Claude Code?

Run `npx skills add hamzafarooq/claude-code-starter --skill claude-code-deck -a claude-code`. Or copy the skill folder (.claude/skills/claude-code-deck in hamzafarooq/claude-code-starter) into .claude/skills/claude-code-deck in your project. Claude Code loads it when a task matches its description.

How do I install Claude Code Deck in Codex?

Run `npx skills add hamzafarooq/claude-code-starter --skill claude-code-deck -a codex`. Or copy the skill folder (.claude/skills/claude-code-deck in hamzafarooq/claude-code-starter) into .agents/skills/claude-code-deck in your project. Codex loads it when a task matches its description.

Can I use Claude Code Deck in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add hamzafarooq/claude-code-starter --skill claude-code-deck -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/claude-code-deck, .gemini/skills/claude-code-deck, .github/skills/claude-code-deck and .opencode/skills/claude-code-deck in your project.

What does Claude Code Deck need to run?

Going by SKILL.md and its folder, Claude Code Deck needs the command-line tools its instructions call (vercel).

Does Claude Code Deck access the network?

SKILL.md names 1 domain. As links in the text: claude-deck.vercel.app. This is read from the text; nothing was executed.

Is Claude Code Deck safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Claude Code Deck use?

Claude Code Deck is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Claude Code Deck use?

About 972 tokens (SKILL.md is roughly 3.9k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Claude Code Deck?

Skills that share tags, products or a category with Claude Code Deck: Paseo Advisor Second Opinion (getpaseo/paseo, 20k stars), O2 Review Loop (openobserve/openobserve, 22k stars), Kimi Code Delegation (CherryHQ/cherry-studio, 52k stars) and Harness Agent Team Designer (revfactory/harness, 9.1k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Claude Code Deck?

hamzafarooq (a GitHub user) maintains it in hamzafarooq/claude-code-starter, which has 145 GitHub stars. The repository holds 29 skills in this directory. The repository was last updated on September 13, 2026.

Source: hamzafarooq/claude-code-starter on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.

Claude Code Deck

Install Claude Code Deck

Facts

At a glance

What it does

When your agent uses it

Example prompts

Workflow steps

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

Claude Code Deck

What This Skill Produces

Slide Outline

Instructions

Regeneration Template

Bold Signal Design Reference

Live Demo

Files

Compare with similar skills

Similar skills

Paseo Advisor Second Opinion

O2 Review Loop

Kimi Code Delegation

Harness Agent Team Designer

ClawTeam Multi-Agent Swarm

Sub-Agent Delegation

More from hamzafarooq/claude-code-starter

Beautiful HTML

Competitor Research

Frontend Slides

Md To PDF

User Story Writer

Dockerfile Generator

Questions about Claude Code Deck

Install Claude Code Deck

Facts

At a glance

What it does

When your agent uses it

Example prompts

Workflow steps

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

Claude Code Deck

What This Skill Produces

Slide Outline

Instructions

Regeneration Template

Bold Signal Design Reference

Live Demo

Files

Compare with similar skills

Similar skills

More from hamzafarooq/claude-code-starter

Related

Questions about Claude Code Deck