PLUGIN DOCUMENTATION

Visual Explainer

Generate presentation-ready HTML explainers for plans, diffs, diagrams, audits, and stakeholder updates with optional Netlify preview.

Overview

Generate presentation-ready HTML explainers for plans, diffs, diagrams, audits, and stakeholder updates with optional Netlify preview.

Bundles 1 skill with 1 Claude Code wrapper. Codex users install the same skill directories directly from GitHub.

Skills

Each skill is a SKILL.md file with YAML frontmatter and Markdown instructions.

visual-explainer

Generate self-contained, presentation-ready HTML explainers for plans, diffs, docs, architecture, audits, and stakeholder updates.

plugins/visual-explainer/skills/visual-explainer

Skill docs →

Slash Commands

Claude Code wrapper files live under plugins/visual-explainer/commands/ and surface as namespaced commands. Codex invokes the underlying skill by name (for example, name: visual-explainer).

/visual-explainer:explain

Installation

Install the plugin for Claude Code, or install one or more skill paths for Codex.

Claude Code

bash

claude plugin marketplace add DiversioTeam/agent-skills-marketplace
claude plugin install visual-explainer@diversiotech

Codex

bash

CODEX_HOME="${CODEX_HOME:-$HOME/.codex}"
python3 "$CODEX_HOME/skills/.system/skill-installer/scripts/install-skill-from-github.py" \
  --repo DiversioTeam/agent-skills-marketplace \
  --path plugins/visual-explainer/skills/visual-explainer

Claude Code: invoke as /visual-explainer:explain. Codex: invoke as name: visual-explainer.