visual-explainer

visual-explainer

Transforms complex terminal output into easy-to-read HTML pages or slides.

Agent SkillDevOpen source
Type
Agent Skill
Open source
Yes
GitHub Stars
★ 9.0k
Source
skill-github

Overview

visual-explainer is an agent skill that generates rich HTML pages or slides for visualizing charts, diff reviews, plan audits, data tables, and project summaries. It converts intricate system architecture diagrams, diff reviews, and plan comparisons into self-contained HTML pages that open in a browser. This capability enables AI to present complex information in a more intuitive way, ideal for developers and teams. It can be installed via multiple methods, such as the Claude Code plugin marketplace, Pi package manager, and others.

Capabilities

  • Generate HTML pages for charts
  • Visualize diff reviews
  • Visualize plan audits
  • Generate data tables
  • Generate project summaries

Use cases

System architecture diagram generationCode diff reviewRequirement vs. plan comparisonProject summary reports

Setup

Requires: Node 环境
For Claude Code: "/plugin marketplace add nicobailon/visual-explainer" and "/plugin install visual-explainer@visual-explainer-marketplace"; for Pi: "pi install git:github.com/nicobailon/visual-explainer"

This information was compiled by AI from public sources and may contain inaccuracies — please refer to the source.

FAQ

Which platforms are supported?

Supports Claude Code, Pi, Codex CLI, OpenCode/opencode, Cursor, and OpenClaw.

How do I install it?

Choose the installation command based on your platform, for example, the Claude Code plugin marketplace or Pi package manager.

Related skills