ClaudeCreate a user-login flowchart
Uses mermaid
- The steps, decisions, and outcomes in the user login process
/mermaid create a flowchart for user login process
README.md ↗ · Checked Sep 18, 2026.claude/skills/mermaid/SKILL.md ↗ · Checked Sep 18, 2026
Last commit on August 11, 2026·Created on January 23, 2026
WH-2099/mermaid-skill
“Turns requirements into Mermaid diagrams across twenty-three formats.”
Combined rank
#639
across all skills
Stars
280
+1.1% in last 7d
Forks
35
+2.9% in last 7d
Watchers
1
+1 watchers in last 7d
Traction scoreGitHub stars can be faked, so popularity alone can be misleading. Traction Score looks for broader signs of recent attention, adoption, and active maintenance.
TL;DR
This skill generates Mermaid diagrams from plain requirements, covering twenty-three diagram types from flowcharts and sequence diagrams to C4 architecture and Gantt charts. It helps software architects, product managers, technical writers, and data engineers turn descriptions into visual documentation without leaving the editor. The skill reads syntax references before writing, so output is structured and render-ready.
WHO IT'S FOR
Software Architects
creating system architecture diagrams
Technical Writers
documenting user flows and timelines
Project Managers
planning project timelines and workflows
Data Engineers
designing database schemas and models
Compatible AgentsThe repository documents support for these agents. The skills may also work with other agents that can load SKILL.md files, but they may need some setup or small changes.
Use this skill
Follow the documented setup, then try a first task.
Copy skill into a Claude Code project
Installs: Single project · Claude Code
Before you start
- Git must be available to run the documented clone command.
- A terminal environment providing the documented cp command.
In a terminal, clone the repository and copy its Mermaid skill into the target project's .claude/skills directory. Replace /path/to/your/project with the path to your project, keeping the placeholder itself unchanged in the command until you make that substitution.
git clone https://github.com/WH-2099/mermaid-skill.git cp -r mermaid-skill/.claude/skills/mermaid /path/to/your/project/.claude/skills/
README.md ↗ · Checked Sep 18, 2026
Add skill as a Git submodule
Installs: Single project · Claude Code
Before you start
- Git must be available to add the documented submodule.
- A terminal environment providing the documented ln command and symbolic-link support.
Run from: Project root
In a terminal at the project root, add the repository beneath .claude/skills and create the documented symbolic link for the Mermaid skill.
git submodule add https://github.com/WH-2099/mermaid-skill.git .claude/skills/mermaid-skill ln -s mermaid-skill/.claude/skills/mermaid .claude/skills/mermaid
README.md ↗ · Checked Sep 18, 2026
Give it something to do.
Draw an API-authentication sequence diagram
Uses mermaid
- The API authentication participants, messages, and their order
/mermaid draw a sequence diagram for API authentication
README.md ↗ · Checked Sep 18, 2026.claude/skills/mermaid/SKILL.md ↗ · Checked Sep 18, 2026
Create an e-commerce ER diagram
Uses mermaid
- The e-commerce entities, their important attributes, and relationships
/mermaid ER diagram for an e-commerce database
README.md ↗ · Checked Sep 18, 2026.claude/skills/mermaid/SKILL.md ↗ · Checked Sep 18, 2026