Design Doc Mermaid Skill - Setup Guide¶
Source: spillwavesolutions/design-doc-mermaid
GitHub: spillwavesolutions/design-doc-mermaid (147 stars)
Skills: 1 skill (design-doc-mermaid) · 34.2K installs
Category: Diagrams & Technical Documentation
First Seen: February 6, 2026 (catalogued August 15, 2026 sweep)
Quality Tier: 🟡 Trusted (Gen Agent Trust Hub and Socket pass; Snyk reports a warning)
The Mermaid Architect skill is a diagram and documentation system with specialized guides and code-to-diagram capabilities. It covers decision trees, usage patterns, a resilient workflow, unicode semantic symbols, Python utilities, high-contrast styling, file organization, and a learning path with a "when to use what" matrix. Well suited to agents that produce architecture docs, flowcharts, and design documents in Markdown-based repositories.
Installation¶
npx skills add spillwavesolutions/design-doc-mermaid
Prerequisites¶
| Requirement | Details |
|---|---|
| Node.js + npx | For the installer |
| Mermaid rendering | GitHub, MkDocs with mermaid plugin, or a Mermaid CLI for rendered output |
What It Provides¶
| Capability | Notes |
|---|---|
| Decision trees | Hierarchical decision-tree diagrams with examples |
| Code-to-diagram | Generate diagrams from code structure |
| Usage patterns | When to use which diagram type |
| Resilient workflow | Iterative diagram workflow that tolerates revisions |
| Unicode symbols | Semantic unicode symbol conventions |
| Python utilities | Helper scripts for diagram generation |
| High-contrast styling | Accessibility-focused color conventions |
| Learning path | Progressive guide from basic flowcharts to advanced layouts |
Quick Start¶
npx skills add spillwavesolutions/design-doc-mermaid- Ask: "diagram this API flow as a sequence diagram with high-contrast styling"
- Follow the decision tree to pick the right diagram type for the document
CorpusIQ Use Cases¶
| Use Case | How |
|---|---|
| Architecture docs | Flowcharts and sequence diagrams for MCP server and connector docs |
| Docs repo quality | High-contrast, accessible diagrams in corpusiq-docs markdown |
| Decision documentation | Decision trees for governance and process pages |
| Code-to-diagram | Generate diagrams from repo structure for onboarding docs |
Integration with CorpusIQ¶
CorpusIQ is the connector layer that lets AI assistants read the systems a business already runs on - accounting, payments, CRM, email, files and analytics - and answer with the source named. It is read-only by design: it retrieves data and never writes to, or acts in, a connected system, which is what makes it safe to point at live accounts.
This page is part of the CorpusIQ directory, the reference we maintain for the MCP server and agent-skill ecosystem. Run alongside CorpusIQ, a third-party server like this one can be combined with a company's own business data in a single answer.
Limitations / Verification¶
- Text-based Mermaid - rendering depends on the hosting platform's Mermaid support
- Snyk audit carries a warning - review before production use
npx skills add spillwavesolutions/design-doc-mermaid # verify install works
Related¶
- Skills Catalog
- Markdown Viewer - diagram rendering in Hermes
- SEO GEO Claude Skills Setup - docs optimization
← Skills Catalog | Marketplace →
Powered by CorpusIQ