skills.rest
Cloud-Byte-Consulting
Cloud-Byte-ConsultingOFFICIAL
Explore all skills by this author →
GitHub

ado-wiki-mermaid

Generates Azure DevOps Wiki-ready Mermaid diagrams using ::: mermaid container fences.

Updated Jul 16, 2026
Search Tags:#ci/cd#documentation#markdown#mermaid#wiki#diagrams#azure devops
One-click install
npx skills add https://github.com/Cloud-Byte-Consulting/plugins --skill ado-wiki-mermaid-cloud-byte-consulting
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ado-wiki-mermaid
Source: https://github.com/Cloud-Byte-Consulting/plugins/tree/main/azure-devops-cicd/skills/ado-wiki-mermaid
Command: npx skills add https://github.com/Cloud-Byte-Consulting/plugins --skill ado-wiki-mermaid-cloud-byte-consulting

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Mermaid diagrams written for GitHub often fail to render in Azure DevOps Wiki, PR comments, and work-item descriptions because Azure DevOps requires the ::: mermaid container fence and supports only a limited Mermaid dialect. This Skill produces diagrams and Markdown that render correctly on Azure DevOps surfaces. ## Core Features & Use Cases - ADO-safe Mermaid output: Enforces the ::: mermaid container fence, graph (not flowchart) syntax, short node IDs, and excludes unsupported arrows, HTML, and Font Awesome. - Ready-made diagram templates: Provides current-state SDLC, target-state CI/CD, and governance diagram templates adaptable to discovered services and controls. - Safe Wiki publishing workflow: Requires confirmation of organization, project, wiki path, and explicit approval before any page is written. - Use Case: After assessing an Azure DevOps organization, generate a current-state pipeline diagram and a target-state CI/CD architecture diagram that render directly in the project Wiki. ## Quick Start Use ado-wiki-mermaid to create a current-state and target-state CI/CD diagram for my Azure DevOps Wiki page.

Frequently Asked Questions about ado-wiki-mermaid

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add Mermaid diagrams to an Azure DevOps Wiki page?▼

Use the ::: mermaid container fence instead of GitHub triple-backtick fences, and write diagrams with graph LR or graph TB syntax. Azure DevOps Wiki renders only this container form with a limited Mermaid dialect.

Why does my Mermaid diagram not render in Azure DevOps Wiki?▼

Azure DevOps supports a restricted Mermaid dialect: flowchart blocks, long arrows, HTML tags, Font Awesome, and subgraph links are unsupported. Use graph syntax, short alphanumeric node IDs, and standard arrows.

Can I use GitHub-style mermaid code fences in Azure DevOps?▼

No. GitHub-style triple-backtick mermaid fences do not render on Azure DevOps surfaces. Wiki pages, PR comments, and work-item descriptions require the ::: mermaid ... ::: container form.

Does this Skill publish diagrams to the Wiki automatically?▼

No. Wiki-ready output is not permission to publish. Publishing requires confirming the organization, project, wiki, and page path, showing the full Markdown, and obtaining explicit approval before any write.

What diagram templates are included for CI/CD documentation?▼

Templates cover a current-state SDLC and traceability diagram, a target-state CI/CD and environment-promotion diagram, and a governance diagram for identity, permissions, and separation of duties.

Related Skills

Explore More Software Engineering Skills→
mattmacleod16-svgmattmacleod16-svg
1

azure-devops-cli

Automate Azure DevOps resource management via the Azure CLI extension.

Community
Intermediate
francoisbgdwfrancoisbgdw

azure-devops

Automate Azure DevOps pipelines, work items, repos, PRs, and wiki tasks.

Community
Intermediate
tractorjuicetractorjuice
2.1k

arckit-aws-research

Research AWS services and architecture patterns from official documentation.

Community
Advanced
gonzalezpazmonicagonzalezpazmonica
47

diagram-import

Import architectural diagrams from Draw.io, Miro, and Mermaid into Azure DevOps work items.

Community
Advanced