pretty-mermaid

Actually renders Mermaid to SVG or ASCII instead of emitting text and hoping something downstream draws it. Bundles the render scripts.

Score 0(?)CommunityCodeby imxvSourceDocs
Verified for:

Install

$ npx skills add https://github.com/imxv/pretty-mermaid-skills --skill pretty-mermaid

Needs Node.js; dependencies install on first run. Bundles render, batch and theme scripts plus diagram-type and theme references.

Best for

Turning Mermaid source into a finished SVG or a terminal-friendly ASCII diagram, with themes applied and batches handled in one pass.

Not ideal for

Anything needing a recent upstream. This is community-maintained and its last release predates most of the current agent tooling — useful, but not actively tracking the ecosystem.

About this skill

Render beautiful Mermaid diagrams as SVG or ASCII art using the beautiful-mermaid library. Supports 15+ themes and 5 diagram types (flowchart, sequence, state, class, ER). Use when asked to render a Mermaid diagram or given .mmd files, to create a flowchart, sequence diagram or state diagram, to apply a theme or beautify a diagram, to batch process multiple diagrams, when an ASCII or terminal-friendly diagram is needed, or to visualize architecture, workflows and data models.

MermaidSVGASCII

Score breakdown

Score breakdown

rubric 1.0
Install count
0/20
Provenance
8.3/15
GitHub stars
8.6/15
Recency
3.5/10
Compatibility
2/10
Documentation depth
10/10
Install ergonomics
10/10
License
5/5
Verification freshness
0.5/5

Composite 0–100 score derived from 9 verifiable signals. See the rubric →

D3.js patterns for interactive viz that does not look stock.

D3.jsVizInteractive
Code
Low2 min

Mermaid diagrams from prose with self-validating syntax. Sequence, flowchart, ER, state.

MermaidDiagramsMarkdown
All surfaces
Low1 min

Ranked #6 in Diagrams

Publish the ranking in your README. The badge reads the live score, so it updates when the ranking does.

pretty-mermaid — ranked #6 in Diagrams on Top Agent Skills
Markdown
[![pretty-mermaid — ranked #6 in Diagrams on Top Agent Skills](https://top-agent-skills.com/badge/pretty-mermaid.svg)](https://top-agent-skills.com/skill/pretty-mermaid)
HTML
<a href="https://top-agent-skills.com/skill/pretty-mermaid"><img src="https://top-agent-skills.com/badge/pretty-mermaid.svg" alt="pretty-mermaid — ranked #6 in Diagrams on Top Agent Skills"></a>

Skill FAQ

About pretty-mermaid

What is the pretty-mermaid skill?

Render beautiful Mermaid diagrams as SVG or ASCII art using the beautiful-mermaid library. Supports 15+ themes and 5 diagram types (flowchart, sequence, state, class, ER). Use when asked to render a Mermaid diagram or given .mmd files, to create a flowchart, sequence diagram or state diagram, to apply a theme or beautify a diagram, to batch process multiple diagrams, when an ASCII or terminal-friendly diagram is needed, or to visualize architecture, workflows and data models.

Which agents does pretty-mermaid work with?

Claude Code.

How do I install pretty-mermaid?

Run `npx skills add https://github.com/imxv/pretty-mermaid-skills --skill pretty-mermaid` for Claude Code. See the install panel for per-agent commands.

Is pretty-mermaid free to use?

Yes — pretty-mermaid is open source (MIT).

Who maintains pretty-mermaid?

pretty-mermaid is published by imxv and was last updated on 2026-01-31.

What is pretty-mermaid best for?

Turning Mermaid source into a finished SVG or a terminal-friendly ASCII diagram, with themes applied and batches handled in one pass.