# Plannotator Visual Explainer (agent skill)

> Plannotator Visual Explainer is an agent skill (a SKILL.md file) from backnotprop/plannotator. Generate self-contained HTML visualizations with Plannotator theming. It works with Claude Code, Codex, Gemini CLI, GitHub Copilot and OpenCode and has 9,185 GitHub stars across a repository of 4 listed skills.

Generate self-contained HTML visualizations with Plannotator theming. Use for implementation plans, PR explainers, architecture diagrams, data tables, slide decks, and any visual explanation of technical concepts. Plans and PR explainers follow Plannotator's prescriptive approach; all other visual content delegates to nicobailon/visual-explainer. Three paths depending on content type. Each has its own references and structure.

## Key facts

| Fact | Value |
|---|---|
| Repository | https://github.com/backnotprop/plannotator |
| Skill path | apps/skills/extra/plannotator-visual-explainer/SKILL.md |
| Skill name | plannotator-visual-explainer |
| GitHub stars | 9,185 |
| Installs on skills.sh | not listed |
| License | Apache-2.0 |
| Skills in repo | 4 |
| Plugin marketplace | plannotator |
| Official | no |
| Works with | Claude Code, Codex, Gemini CLI, GitHub Copilot, OpenCode |
| Category | Docs & writing |
| Last commit | Oct 7, 2026 |

## When it triggers

- Use for implementation plans, PR explainers, architecture diagrams, data tables, slide decks, and any visual explanation of technical concepts.

## Add this skill

### Claude Code

```sh
/plugin marketplace add backnotprop/plannotator
/plugin install plannotator@plannotator
```

In the Claude apps, zip the skill folder and upload it under Customize > Skills > + > Upload a skill (code execution must be on).

### ChatGPT / Codex

```sh
git clone --depth 1 https://github.com/backnotprop/plannotator.git
cp -r plannotator/apps/skills/extra/plannotator-visual-explainer .agents/skills/plannotator-visual-explainer   # repo; ~/.agents/skills for all projects
```

### Cursor

```sh
git clone --depth 1 https://github.com/backnotprop/plannotator.git
cp -r plannotator/apps/skills/extra/plannotator-visual-explainer .cursor/skills/plannotator-visual-explainer   # project; ~/.cursor/skills for all projects
```

Sources (checked 2026-10-07): https://code.claude.com/docs/en/skills, https://support.claude.com/en/articles/12512180-using-skills-in-claude, https://learn.chatgpt.com/docs/build-skills, https://cursor.com/docs/context/skills

---

Canonical page: https://appsgit.com/skills/backnotprop-plannotator-visual-explainer
Source: appsgit (https://appsgit.com), the app store for github. Data from the GitHub API, refreshed nightly.
Machine access: JSON API https://appsgit.com/api/v1/apps (OpenAPI: https://appsgit.com/openapi.json), MCP server https://mcp.appsgit.com/mcp, full index https://appsgit.com/llms-full.txt.