mermaid-preview
mermaid-preview
Auto-preview Mermaid diagrams in your browser as you edit
What is mermaid-preview?
Mermaid Preview automatically renders Mermaid diagram syntax in a browser tab as you write or edit code. It includes an offline-safe bundled Mermaid renderer, supports dark mode, and intelligently manages preview tabs with LRU retention.
- Auto-preview Mermaid diagrams on write, edit, and notebook operations
- Bundled Mermaid renderer—works offline without external dependencies
- Dark mode aware rendering
- Auto-reload preview when diagram source changes
- Per-file preview tabs with LRU cache retention
- Optional force-open mode to open preview tab on every write
How to install mermaid-preview
Claude Code install command.
/plugin install mermaid-preview@xiaolaiWorks with
Agents this plugin has been detected to support.
Related plugins

nlpm
Score, lint, and fix natural-language artifacts across Claude Code, Codex, and Antigravity with tier-aware quality rules.

north-star
System prompt that overrides RLHF defaults: removes confirmation-seeking, scarcity thinking, and best-practice ceilings.

reason-grill
Deep argument interrogation with adversarial analysis and calibrated verdicts.

tdd-guardian
Enforce strict test-driven development with per-lane gates, property testing, and mutation verification across 25+ languages.

ui-responsive
Responsive design advisor that flags non-responsive patterns in your code

ui-tokenize
Block hardcoded UI values and enforce design tokens through rewrite-first hooks.