mermaid-display

Community

Render Mermaid diagrams to PNG/SVG.

Authormusingfox
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Visualize Mermaid syntax by converting it into PNG or SVG images that open in the default viewer, streamlining diagram creation for documentation and design reviews.

Core Features & Use Cases

  • Render Mermaid diagrams to PNG or SVG using mmdc or the mermaid-cli via npx.
  • Auto-open rendered diagrams in the default viewer and support multiple diagram types (flowcharts, sequence diagrams, class diagrams, state machines, ER diagrams).
  • Configure themes with built-in color schemes or a custom palette to match project branding.

Quick Start

Create a Mermaid diagram and save it to /tmp/diagram.mmd, then render it with the provided script and view the resulting image.

Dependency Matrix

Required Modules

None required

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: mermaid-display
Download link: https://github.com/musingfox/cc-plugins/archive/main.zip#mermaid-display

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.