mermaid-expert
Create and style Mermaid diagrams for documentation and architecture visualization.
Install
mkdir -p .claude/skills/mermaid-expert && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/869" && unzip -o skill.zip -d .claude/skills/mermaid-expert && rm skill.zipInstalls to .claude/skills/mermaid-expert
Activation
This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.
Create Mermaid diagrams for flowcharts, sequences, ERDs, and architectures. Masters syntax for all diagram types and styling.Key capabilities
- →Generate flowchart and decision tree syntax
- →Create sequence diagrams for API interactions
- →Design entity-relationship models for database schemas
- →Produce Gantt charts for project timelines
- →Apply consistent styling and labels to diagrams
How it works
The skill applies best practices for Mermaid syntax to generate structured diagram code, focusing on readability and professional visualization standards.
Inputs & outputs
When to use mermaid-expert
- →Visualize an API sequence flow
- →Document database schemas with an ERD
- →Create a process flowchart for a feature
- →Design a project gantt chart
About this skill
Use this skill when
- Working on mermaid expert tasks or workflows
- Needing guidance, best practices, or checklists for mermaid expert
Do not use this skill when
- The task is unrelated to mermaid expert
- You need a different domain or tool outside this scope
Instructions
- Clarify goals, constraints, and required inputs.
- Apply relevant best practices and validate outcomes.
- Provide actionable steps and verification.
- If detailed examples are required, open
resources/implementation-playbook.md.
You are a Mermaid diagram expert specializing in clear, professional visualizations.
Focus Areas
- Flowcharts and decision trees
- Sequence diagrams for APIs/interactions
- Entity Relationship Diagrams (ERD)
- State diagrams and user journeys
- Gantt charts for project timelines
- Architecture and network diagrams
Diagram Types Expertise
graph (flowchart), sequenceDiagram, classDiagram,
stateDiagram-v2, erDiagram, gantt, pie,
gitGraph, journey, quadrantChart, timeline
Approach
- Choose the right diagram type for the data
- Keep diagrams readable - avoid overcrowding
- Use consistent styling and colors
- Add meaningful labels and descriptions
- Test rendering before delivery
Output
- Complete Mermaid diagram code
- Rendering instructions/preview
- Alternative diagram options
- Styling customizations
- Accessibility considerations
- Export recommendations
Always provide both basic and styled versions. Include comments explaining complex syntax.
Limitations
- Use this skill only when the task clearly matches the scope described above.
- Do not treat the output as a substitute for environment-specific validation, testing, or expert review.
- Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.
When not to use it
- →Tasks unrelated to visual diagramming
- →Situations requiring non-Mermaid diagram formats
Limitations
- →Output requires external rendering validation
- →Limited to Mermaid-supported diagram types
How it compares
This approach provides expert-validated syntax and styling best practices instead of generic, potentially cluttered diagram generation.
Compared to similar skills
mermaid-expert side by side with the closest alternatives in the catalog.
| Skill | Installs | Updated | Safety | Difficulty |
|---|---|---|---|---|
| mermaid-expert (this skill) | 27 | 4mo | No flags | Beginner |
| draw-io | 41 | 6mo | Review | Intermediate |
| excalidraw-diagram-generator | 18 | 2mo | Review | Beginner |
| scientific-schematics | 7 | 7mo | Review | Beginner |
Try saying
Example prompts that trigger this skill in your AI assistant.
More by sickn33
View all by sickn33 →You might also like
draw-io
davila7
draw.io diagram creation, editing, and review. Use for .drawio XML editing, PNG conversion, layout adjustment, and AWS icon usage.
excalidraw-diagram-generator
github
Generate Excalidraw diagrams from natural language descriptions. Use when asked to "create a diagram", "make a flowchart", "visualize a process", "draw a system architecture", "create a mind map", or "generate an Excalidraw file". Supports flowcharts, relationship diagrams, mind maps, and system architecture diagrams. Outputs .excalidraw JSON files that can be opened directly in Excalidraw.
scientific-schematics
davila7
Create publication-quality scientific diagrams using Nano Banana Pro AI with smart iterative refinement. Uses Gemini 3 Pro for quality review. Only regenerates if quality is below threshold for your document type. Specialized in neural network architectures, system diagrams, flowcharts, biological pathways, and complex scientific visualizations.
mermaid-diagrams
davila7
Comprehensive guide for creating software diagrams using Mermaid syntax. Use when users need to create, visualize, or document software through diagrams including class diagrams (domain modeling, object-oriented design), sequence diagrams (application flows, API interactions, code execution), flowcharts (processes, algorithms, user journeys), entity relationship diagrams (database schemas), C4 architecture diagrams (system context, containers, components), state diagrams, git graphs, pie charts, gantt charts, or any other diagram type. Triggers include requests to "diagram", "visualize", "model", "map out", "show the flow", or when explaining system architecture, database design, code structure, or user/application flows.
plantuml-ascii
github
Generate ASCII art diagrams using PlantUML text mode. Use when user asks to create ASCII diagrams, text-based diagrams, terminal-friendly diagrams, or mentions plantuml ascii, text diagram, ascii art diagram. Supports: Converting PlantUML diagrams to ASCII art, Creating sequence diagrams, class diagrams, flowcharts in ASCII format, Generating Unicode-enhanced ASCII art with -utxt flag
mermaidjs-v11
mrgoonie
Create diagrams and visualizations using Mermaid.js v11 syntax. Use when generating flowcharts, sequence diagrams, class diagrams, state diagrams, ER diagrams, Gantt charts, user journeys, timelines, architecture diagrams, or any of 24+ diagram types. Supports JavaScript API integration, CLI rendering to SVG/PNG/PDF, theming, configuration, and accessibility features. Essential for documentation, technical diagrams, project planning, system architecture, and visual communication.