Installation

Visual Plan has two pieces: the skill that teaches your agent to author plans, and the CLI that renders them. Install both.

The agent skill

Installs the visual-plan skill into your coding agent so it authors plans visually:

npx skills add brandonburrus/visualplan

This works with any agent that supports the skills format, Claude Code, Cursor, Codex, and others.

The skill renders plans with vplan, so install it too (the skill will prompt for this if it is missing):

npm i -g vplan

Or run it without installing:

npx vplan plan.mdx

Node.js 20 or newer. The CLI compiles the plan with Vite at render time.
A browser to view the output (the render opens it for you; pass --no-open to skip).

Render the built-in example to confirm everything works:

vplan components   # prints the component vocabulary cheat-sheet

If vplan is not found after a global install, make sure your npm global bin directory is on your PATH, or use npx vplan instead.