New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

Mermaid Diagram Specialist

by davila7 in davila7/claude-code-templates

Mermaid diagram specialist for creating flowcharts, sequence diagrams, ERDs, and architecture visualizations

MITAuto-check passedDevelopment

Install Mermaid Diagram Specialist

skills CLI
$ npx skills add davila7/claude-code-templates --skill mermaid-diagram-specialist -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install davila7/claude-code-templates mermaid-diagram-specialist --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/davila7/claude-code-templates.git skills-src && mkdir -p .claude/skills && cp -r skills-src/cli-tool/components/skills/development/mermaid-diagram-specialist .claude/skills/mermaid-diagram-specialist && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
mermaid-diagram-specialist
GitHub stars
33k
Token cost
~3.8k tokens
SKILL.md length
709 words
Files
1
Skills in repo
479
Repo updated
First seen
Licence
MIT

At a glance

Mermaid diagram specialist for creating flowcharts, sequence diagrams, ERDs, and architecture visualizations

  • Works in 7 steps: Diagram Type Selection → Flowchart Creation → Sequence Diagram Creation → …
  • Tasks that involve Diagrams
  • SKILL.md covers Overview, When to Use This Skill, Prerequisites and Input, plus 5 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Mermaid Diagram Specialist is an agent skill from davila7/claude-code-templates. Mermaid diagram specialist for creating flowcharts, sequence diagrams, ERDs, and architecture visualizations

Its SKILL.md is about 3.8k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Development, covering Diagrams. It works with Mermaid. The repository describes itself as: CLI tool for configuring and monitoring Claude Code. The licence is MIT.

When your agent uses it

  • Tasks that involve Diagrams

Example prompts

  • “/mermaid-diagram-specialist”

Workflow steps

7 steps, taken from the step headings in SKILL.md.

  1. Diagram Type Selection
  2. Flowchart Creation
  3. Sequence Diagram Creation
  4. ERD Creation
  5. C4 Architecture Diagrams
  6. State Diagram Creation
  7. Styling and Customization

What it can do on your machine

Read from SKILL.md and the folder at commit c0ca7da. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md (its code samples are mermaid).

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Mermaid Diagram Specialist loads about 3.8k tokens when it runs. Until then it costs about 34 tokens; SKILL.md has 709 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~34
When it runs · the whole SKILL.md, loaded when a task matches
~3.8k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from davila7/claude-code-templates at commit c0ca7da, republished under its MIT licence (© davila7). 709 words, ~3,815 tokens.

Download SKILL.mdSave it as .claude/skills/mermaid-diagram-specialist/SKILL.md (or your agent's skills folder).
name
mermaid-diagram-specialist
description
Mermaid diagram specialist for creating flowcharts, sequence diagrams, ERDs, and architecture visualizations
category
tech
usage
Use when creating technical documentation, visualizing workflows, documenting architecture, or explaining system design
input
Process description, data model, architecture requirements, workflow steps
output
Mermaid diagrams (flowchart, sequence, ERD, C4, state, etc.) in markdown

Mermaid Diagram Specialist

Overview

Purpose: Expert in creating comprehensive Mermaid diagrams for documentation, architecture visualization, and process mapping

Category: Tech Primary Users: tech-writer, architecture-validator, product-technical, tech-lead

When to Use This Skill

  • Creating architecture documentation
  • Visualizing workflows and processes
  • Documenting data models (ERDs)
  • Explaining sequence flows
  • Creating state machines
  • Documenting component relationships
  • Creating decision trees
  • Visualizing user journeys

Prerequisites

Required:

  • Understanding of the system/process to document
  • Access to technical specifications
  • Knowledge of diagram type needed

Optional:

  • Design system colors for consistency
  • Existing documentation to reference

Input

What the skill needs:

  • Process/system description
  • Entities and relationships (for ERDs)
  • Component interactions (for sequence diagrams)
  • Architecture layers (for C4 diagrams)
  • States and transitions (for state diagrams)

Workflow

Step 1: Diagram Type Selection

Objective: Choose appropriate diagram type for requirements

Available Diagram Types:

  1. Flowchart: Decision flows, algorithms, processes
  2. Sequence Diagram: API interactions, message flows
  3. ERD: Database schemas, entity relationships
  4. Class Diagram: Object-oriented design
  5. State Diagram: State machines, lifecycle
  6. Gantt Chart: Project timelines, schedules
  7. C4 Diagram: Architecture at different levels
  8. Pie/Bar Charts: Data visualization
  9. Git Graph: Version control flows
  10. User Journey: User experience flows

Decision Matrix:

  • Process with decisions → Flowchart
  • API/system interactions → Sequence Diagram
  • Database structure → ERD
  • System architecture → C4 Diagram
  • Object relationships → Class Diagram
  • State transitions → State Diagram
  • Project timeline → Gantt Chart

Validation:

  • Diagram type matches content
  • Complexity appropriate
  • Audience considered
  • Purpose clear

Output: Selected diagram type

Step 2: Flowchart Creation

Objective: Create process and decision flow diagrams

Syntax:

mermaid
flowchart TD
    Start([Start]) --> Input[/User Input/]
    Input --> Validate{Valid?}
    Validate -->|Yes| Process[Process Data]
    Validate -->|No| Error[Show Error]
    Error --> Input
    Process --> Save[(Save to DB)]
    Save --> Success[/Success Response/]
    Success --> End([End])

Node Shapes:

  • [Rectangle] - Process step
  • ([Rounded]) - Start/End
  • {Diamond} - Decision
  • [/Parallelogram/] - Input/Output
  • [(Database)] - Data storage
  • ((Circle)) - Connector

Direction Options:

  • TD - Top to Down
  • LR - Left to Right
  • BT - Bottom to Top
  • RL - Right to Left

Example - Booking Flow:

mermaid
flowchart TD
    Start([User Initiates Booking]) --> CheckDates[Check Date Availability]
    CheckDates --> Available{Dates Available?}
    Available -->|No| ShowError[/Show Unavailable Message/]
    ShowError --> End([End])
    Available -->|Yes| CreateBooking[Create Pending Booking]
    CreateBooking --> Payment[Process Payment]
    Payment --> PaymentSuccess{Payment Success?}
    PaymentSuccess -->|No| CancelBooking[Cancel Booking]
    CancelBooking --> ShowError
    PaymentSuccess -->|Yes| ConfirmBooking[Confirm Booking]
    ConfirmBooking --> SendEmail[/Send Confirmation Email/]
    SendEmail --> SaveDB[(Save to Database)]
    SaveDB --> Success[/Show Success/]
    Success --> End

Validation:

  • All paths covered
  • Decision points clear
  • Start and end defined
  • Flow direction logical

Output: Process flowchart

Step 3: Sequence Diagram Creation

Objective: Document API interactions and message flows

Syntax:

mermaid
sequenceDiagram
    actor User
    participant Frontend
    participant API
    participant DB
    participant Payment

    User->>Frontend: Click "Book"
    Frontend->>API: POST /api/bookings
    API->>DB: Check availability
    DB-->>API: Available
    API->>Payment: Process payment
    Payment-->>API: Payment successful
    API->>DB: Create booking
    DB-->>API: Booking created
    API-->>Frontend: 201 Created
    Frontend-->>User: Show confirmation

Participant Types:

  • actor - Human user
  • participant - System/Service
  • database - Database

Arrow Types:

  • -> - Solid line (synchronous)
  • --> - Dotted line (response)
  • ->> - Solid arrow (async message)
  • -->> - Dotted arrow (async response)

Example - Authentication Flow:

mermaid
sequenceDiagram
    actor User
    participant Frontend
    participant API
    participant Clerk
    participant DB

    User->>Frontend: Enter credentials
    Frontend->>Clerk: Login request
    Clerk->>Clerk: Validate credentials
    alt Credentials valid
        Clerk-->>Frontend: JWT token
        Frontend->>API: Request with token
        API->>Clerk: Verify token
        Clerk-->>API: Token valid
        API->>DB: Fetch user data
        DB-->>API: User data
        API-->>Frontend: User session
        Frontend-->>User: Logged in
    else Credentials invalid
        Clerk-->>Frontend: Auth error
        Frontend-->>User: Show error
    end

Validation:

  • All participants identified
  • Message flow logical
  • Return messages shown
  • Alt/loop blocks used correctly

Output: Sequence diagram

Step 4: ERD Creation

Objective: Document database schema and relationships

Syntax:

mermaid
erDiagram
    USER ||--o{ BOOKING : creates
    ACCOMMODATION ||--o{ BOOKING : "booked for"
    USER {
        uuid id PK
        string email UK
        string name
        timestamp created_at
    }
    BOOKING {
        uuid id PK
        uuid user_id FK
        uuid accommodation_id FK
        date check_in
        date check_out
        enum status
    }
    ACCOMMODATION {
        uuid id PK
        string name
        text description
        decimal price_per_night
    }

Relationship Types:

  • ||--|| - One to one
  • ||--o{ - One to many
  • }o--o{ - Many to many
  • ||--o| - One to zero or one

Cardinality Symbols:

  • || - Exactly one
  • o| - Zero or one
  • }o - Zero or more
  • }| - One or more

Example - Full Hospeda ERD:

mermaid
erDiagram
    USER ||--o{ BOOKING : creates
    USER ||--o{ REVIEW : writes
    USER ||--o{ ACCOMMODATION : owns
    ACCOMMODATION ||--o{ BOOKING : "has bookings"
    ACCOMMODATION ||--o{ REVIEW : "has reviews"
    ACCOMMODATION }o--o{ AMENITY : includes
    BOOKING ||--|| PAYMENT : "has payment"

    USER {
        uuid id PK
        string clerk_id UK
        string email UK
        string name
        enum role
        timestamp created_at
    }

    ACCOMMODATION {
        uuid id PK
        uuid owner_id FK
        string name
        text description
        decimal price_per_night
        int max_guests
        enum status
    }

    BOOKING {
        uuid id PK
        uuid user_id FK
        uuid accommodation_id FK
        date check_in
        date check_out
        int guests
        enum status
        decimal total_price
    }

    REVIEW {
        uuid id PK
        uuid user_id FK
        uuid accommodation_id FK
        int rating
        text comment
        timestamp created_at
    }

    PAYMENT {
        uuid id PK
        uuid booking_id FK
        string mercadopago_id UK
        decimal amount
        enum status
        timestamp processed_at
    }

    AMENITY {
        uuid id PK
        string name
        string icon
    }

Validation:

  • All entities defined
  • Relationships accurate
  • Cardinality correct
  • Primary/Foreign keys marked

Output: ERD diagram

Show full SKILL.md (290 more words)Show less
Step 5: C4 Architecture Diagrams

Objective: Document system architecture at different levels

Context Level (System in environment):

mermaid
C4Context
    title System Context - Hospeda Platform

    Person(guest, "Guest", "Tourist looking for accommodation")
    Person(owner, "Owner", "Accommodation owner")
    System(hospeda, "Hospeda Platform", "Tourism booking platform")

    System_Ext(clerk, "Clerk", "Authentication provider")
    System_Ext(mercadopago, "Mercado Pago", "Payment processor")
    System_Ext(email, "Email Service", "Transactional emails")

    Rel(guest, hospeda, "Searches and books", "HTTPS")
    Rel(owner, hospeda, "Manages listings", "HTTPS")
    Rel(hospeda, clerk, "Authenticates users", "API")
    Rel(hospeda, mercadopago, "Processes payments", "API")
    Rel(hospeda, email, "Sends notifications", "SMTP")

Container Level (Applications and data stores):

mermaid
C4Container
    title Container - Hospeda Platform

    Person(user, "User")

    Container(web, "Web App", "Astro + React", "Public-facing website")
    Container(admin, "Admin Panel", "TanStack Start", "Management interface")
    Container(api, "API", "Hono", "Backend services")
    ContainerDb(db, "Database", "PostgreSQL", "Stores all data")

    Rel(user, web, "Uses", "HTTPS")
    Rel(user, admin, "Manages", "HTTPS")
    Rel(web, api, "Calls", "JSON/HTTPS")
    Rel(admin, api, "Calls", "JSON/HTTPS")
    Rel(api, db, "Reads/Writes", "SQL")

Component Level (Internal structure):

mermaid
C4Component
    title Components - API Application

    Container(api, "API", "Hono")

    Component(routes, "Routes", "Hono Router", "HTTP endpoints")
    Component(services, "Services", "Business Logic", "Domain operations")
    Component(models, "Models", "Data Access", "DB operations")
    Component(middleware, "Middleware", "Cross-cutting", "Auth, logging, errors")

    Rel(routes, middleware, "Uses")
    Rel(routes, services, "Calls")
    Rel(services, models, "Uses")
    Rel(models, db, "Queries")

Validation:

  • Appropriate level selected
  • All systems/containers shown
  • Relationships clear
  • External systems identified

Output: C4 architecture diagrams

Step 6: State Diagram Creation

Objective: Document state machines and lifecycles

Syntax:

mermaid
stateDiagram-v2
    [*] --> Pending
    Pending --> Confirmed : Payment Success
    Pending --> Cancelled : Payment Failed
    Pending --> Cancelled : User Cancels
    Confirmed --> CheckedIn : Check-in Date
    Confirmed --> Cancelled : Cancellation Request
    CheckedIn --> CheckedOut : Check-out Date
    CheckedOut --> Reviewed : User Submits Review
    CheckedOut --> [*] : 30 Days Elapsed
    Reviewed --> [*]
    Cancelled --> [*]

Example - Booking Lifecycle:

mermaid
stateDiagram-v2
    [*] --> Draft : Create Booking

    state "Pending Payment" as Pending
    state "Payment Processing" as Processing

    Draft --> Pending : Submit Booking
    Pending --> Processing : Initiate Payment

    Processing --> Confirmed : Payment Approved
    Processing --> PaymentFailed : Payment Declined

    PaymentFailed --> Pending : Retry Payment
    PaymentFailed --> Cancelled : Max Retries

    Confirmed --> Active : Check-in Date Reached
    Active --> Completed : Check-out Date Reached

    Confirmed --> CancelRequested : Cancellation Request
    CancelRequested --> RefundProcessing : Approve Cancellation
    RefundProcessing --> Cancelled : Refund Complete

    Completed --> [*]
    Cancelled --> [*]

    note right of Confirmed
        Owner notified
        Calendar blocked
    end note

    note right of Completed
        Review requested
        Payment released
    end note

Validation:

  • All states defined
  • Transitions logical
  • Start/end states marked
  • Notes explain key states

Output: State diagram

Step 7: Styling and Customization

Objective: Apply consistent styling to diagrams

Theme Application:

mermaid
%%{init: {'theme':'base', 'themeVariables': {
  'primaryColor':'#3B82F6',
  'primaryTextColor':'#fff',
  'primaryBorderColor':'#2563EB',
  'lineColor':'#6B7280',
  'secondaryColor':'#10B981',
  'tertiaryColor':'#F59E0B'
}}}%%
flowchart TD
    A[Start] --> B[Process]
    B --> C[End]

Class Styling:

mermaid
flowchart TD
    A[Normal] --> B[Success]
    B --> C[Error]

    classDef successClass fill:#10B981,stroke:#059669,color:#fff
    classDef errorClass fill:#EF4444,stroke:#DC2626,color:#fff

    class B successClass
    class C errorClass

Validation:

  • Colors match brand
  • Contrast sufficient
  • Styling consistent
  • Readable in both themes

Output: Styled diagrams

Output

Produces:

  • Mermaid diagram code in markdown
  • Multiple diagram types as needed
  • Styled and themed diagrams
  • Documentation-ready visualizations

Success Criteria:

  • Diagram accurately represents system
  • All elements properly labeled
  • Relationships clear and correct
  • Styling consistent with brand
  • Renders correctly in markdown

Best Practices

  1. Simplicity: Keep diagrams focused and uncluttered
  2. Labels: Clear, descriptive labels for all elements
  3. Direction: Consistent flow direction (usually top-down or left-right)
  4. Grouping: Use subgraphs to group related elements
  5. Colors: Use color to highlight important elements
  6. Notes: Add notes to explain complex logic
  7. Levels: Use appropriate abstraction level for audience
  8. Updates: Keep diagrams in sync with code
  9. Comments: Add comments in mermaid code for maintainability
  10. Testing: Verify diagrams render in target platform

Common Patterns

API Request Flow
mermaid
sequenceDiagram
    Client->>+API: GET /resource
    API->>+Service: fetchResource()
    Service->>+Model: findById()
    Model->>+DB: SELECT query
    DB-->>-Model: Row data
    Model-->>-Service: Entity
    Service-->>-API: DTO
    API-->>-Client: JSON response
Error Handling Flow
mermaid
flowchart TD
    Request[Incoming Request] --> Validate{Valid?}
    Validate -->|No| ValidationError[Validation Error]
    ValidationError --> ErrorHandler[Error Handler]
    Validate -->|Yes| Process[Process Request]
    Process --> DB{DB Success?}
    DB -->|No| DBError[Database Error]
    DBError --> ErrorHandler
    DB -->|Yes| Success[Success Response]
    ErrorHandler --> LogError[Log Error]
    LogError --> ErrorResponse[Error Response]

Notes

  • Mermaid renders in GitHub, GitLab, Notion, and most markdown viewers
  • Live editor available at mermaid.live
  • Maximum complexity: Keep under 20 nodes for readability
  • Use subgraphs for grouping related nodes
  • Test rendering in target platform before committing
  • Keep diagram source in markdown files, not images
  • Version control diagrams with code
  • Update diagrams during code review

© davila7, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in cli-tool/components/skills/development/mermaid-diagram-specialist of davila7/claude-code-templates.

Open the folder on GitHubat commit c0ca7da

Compare with similar skills

Mermaid Diagram Specialist next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Mermaid Diagram Specialist compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Mermaid Diagram Specialist this skilldavila7/claude-code-templates33k—~3.8kAutomated safety check: PassMIT
Archify Diagramstt-a1i/archify82k—~2.9kAutomated safety check: PassMIT
Diagram Designcathrynlavery/diagram-design49k1 repos~7.6kAutomated safety check: PassMIT
Draw.io Diagram StudioAgents365-ai/drawio-skill10k—~2.4kAutomated safety check: NotesMIT
Pretty Mermaid Rendererimxv/Pretty-mermaid-skills1.5k—~2kAutomated safety check: PassMIT
Archify Diagram BuilderUnclecheng-li/AI_Animation1.5k2 repos~4.1kAutomated safety check: PassMIT

Similar skills

  • Archify Diagrams

    tt-a1i/archify

    Creates interactive architecture, workflow, sequence, data-flow and lifecycle diagrams as standalone HTML with inline SVG, themes and image or video export.

    82k GitHub stars~2.9k tokensUpdated today
    DevelopmentAuto-check passed

  • Diagram Design

    cathrynlavery/diagram-design

    Creates branded diagrams, from architecture, flowchart and sequence to charts and maps, as self-contained HTML with inline SVG, with import from draw.io, Mermaid and Excalidraw.

    49k GitHub starsUsed in 1 repo~7.6k tokens
    DevelopmentAuto-check passed

  • Draw.io Diagram Studio

    Agents365-ai/drawio-skill

    Creates and edits editable draw.io diagrams from descriptions, code, infrastructure files, SQL and API schemas, with sync, review, test and export tools.

    10k GitHub stars~2.4k tokensUpdated today
    DevelopmentAuto-check: notes

  • Pretty Mermaid Renderer

    imxv/Pretty-mermaid-skills

    Writes and renders Mermaid diagrams as themed SVG, PNG or terminal ASCII and Unicode art with a bundled Node.js CLI that needs no browser.

    1.5k GitHub stars~2k tokensUpdated 1 mo ago
    DevelopmentAuto-check passed

  • Archify Diagram Builder

    Unclecheng-li/AI_Animation

    Builds validated architecture, workflow, sequence, data-flow and lifecycle diagrams as standalone interactive HTML from a small JSON spec, with optional motion and image export.

    1.5k GitHub starsUsed in 2 repos~4.1k tokens
    DevelopmentAuto-check passed

  • Mermaid

    WH-2099/mermaid-skill

    Generate Mermaid diagrams from user requirements. An agent skill from WH-2099/mermaid-skill.

    288 GitHub starsUsed in 4 repos~958 tokens
    DevelopmentAuto-check passed

More from davila7/claude-code-templates

All 479 skills in this repo

  • Perplexity Web Search

    davila7/claude-code-templates

    Runs web-grounded searches through Perplexity's Sonar models over OpenRouter for current events, recent literature and cited facts beyond the model's training cutoff.

    33k GitHub starsUsed in 11 repos~3.5k tokens
    Auto-check: notes

  • Neuropixels Data Analysis

    davila7/claude-code-templates

    Analyzes Neuropixels recordings from SpikeGLX or Open Ephys through preprocessing, drift correction, Kilosort4 spike sorting, quality metrics and curation.

    33k GitHub starsUsed in 9 repos~2.8k tokens
    Auto-check passed

  • Scientific Venue Templates

    davila7/claude-code-templates

    Supplies LaTeX templates and formatting rules for journals, conferences, posters, and grant proposals, then can check a draft against them.

    33k GitHub starsUsed in 9 repos~5.1k tokens
    Auto-check: notes

  • Brand Voice Content Creator

    davila7/claude-code-templates

    Analyzes a brand's existing writing to lock in a consistent voice, then builds SEO blog posts and platform-specific social content around it.

    33k GitHub starsUsed in 3 repos~1.9k tokens
    Auto-check passed

  • CAPA Officer

    davila7/claude-code-templates

    Guides corrective and preventive action (CAPA) work in a quality management system, from initiation and root cause analysis through effectiveness verification.

    33k GitHub starsUsed in 1 repo~2k tokens
    Auto-check passed

  • Fda Consultant Specialist

    davila7/claude-code-templates

    Senior FDA consultant and specialist for medical device companies including HIPAA compliance and requirement management.

    33k GitHub starsUsed in 1 repo~2.7k tokens
    Auto-check passed

Works with

Categories

Questions about Mermaid Diagram Specialist

What does Mermaid Diagram Specialist do?

Mermaid diagram specialist for creating flowcharts, sequence diagrams, ERDs, and architecture visualizations. Mermaid Diagram Specialist is an agent skill from davila7/claude-code-templates.

When should I use Mermaid Diagram Specialist?

Mermaid Diagram Specialist fits situations like: tasks that involve Diagrams.

How do I install Mermaid Diagram Specialist in Claude Code?

Run `npx skills add davila7/claude-code-templates --skill mermaid-diagram-specialist -a claude-code`. Or copy the skill folder (cli-tool/components/skills/development/mermaid-diagram-specialist in davila7/claude-code-templates) into .claude/skills/mermaid-diagram-specialist in your project. Claude Code loads it when a task matches its description.

How do I install Mermaid Diagram Specialist in Codex?

Run `npx skills add davila7/claude-code-templates --skill mermaid-diagram-specialist -a codex`. Or copy the skill folder (cli-tool/components/skills/development/mermaid-diagram-specialist in davila7/claude-code-templates) into .agents/skills/mermaid-diagram-specialist in your project. Codex loads it when a task matches its description.

Can I use Mermaid Diagram Specialist in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add davila7/claude-code-templates --skill mermaid-diagram-specialist -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/mermaid-diagram-specialist, .gemini/skills/mermaid-diagram-specialist, .github/skills/mermaid-diagram-specialist and .opencode/skills/mermaid-diagram-specialist in your project.

What does Mermaid Diagram Specialist need to run?

SKILL.md names no scripts, command-line tools or credentials: Mermaid Diagram Specialist is instructions for the agent only.

Does Mermaid Diagram Specialist access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Mermaid Diagram Specialist safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Mermaid Diagram Specialist use?

Mermaid Diagram Specialist is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Mermaid Diagram Specialist use?

About 3.8k tokens (SKILL.md is roughly 15k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Mermaid Diagram Specialist?

Skills that share tags, products or a category with Mermaid Diagram Specialist: Archify Diagrams (tt-a1i/archify, 82k stars), Diagram Design (cathrynlavery/diagram-design, 49k stars), Draw.io Diagram Studio (Agents365-ai/drawio-skill, 10k stars) and Pretty Mermaid Renderer (imxv/Pretty-mermaid-skills, 1.5k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Mermaid Diagram Specialist?

davila7 (a GitHub user) maintains it in davila7/claude-code-templates, which has 32,512 GitHub stars. The repository holds 479 skills in this directory. The repository was last updated on October 10, 2026.

Source: davila7/claude-code-templates on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.