384 templates · page 1 of 4
Mermaid templates
Versatile text-to-diagram language. Renders flowcharts, sequence, class, ER, state, gantt, mindmap, sankey, C4, packet, architecture, kanban, radar, treemap, venn, wardley, eventmodeling and 30+ more. Paste any Mermaid snippet — fully compatible.
Class Diagram
OO class structure with inheritance, composition, interfaces.
UML & SoftwareSequence Diagram
Interaction between actors and systems over time.
UML & SoftwareState Machine
Finite state machine with composite states and transitions.
UML & SoftwareUse Case Diagram
Actors and the use cases they participate in.
UML & SoftwareActivity Diagram
Workflow of activities with decisions and parallelism.
UML & SoftwareComponent Diagram
High-level software components and their interfaces.
UML & SoftwareFlowchart
Classic flowchart with decisions, IO and processes.
Flow & ProcessSwimlane / Cross-functional
Process responsibilities organised by role.
Flow & ProcessPRISMA 2020 Flow
Systematic-review record selection. PRISMA 2020.
Research & AcademicCONSORT Trial Flow
CONSORT randomised-trial participant flow.
Research & AcademicEntity Relationship
Crow's-foot ER diagram with attributes.
Data & SchemaSankey Flow
Energy / budget / cohort flows with proportional widths.
Data & SchemaC4 — System Context
C4 level-1: people and external systems around your system.
ArchitectureC4 — Containers
C4 level-2: containers (apps, services, stores) inside the system.
ArchitectureGantt Chart
Project schedule with dependencies and milestones.
Project & PlanningTimeline
Era-based timeline with grouped events.
Project & PlanningMindmap
Radial mindmap for brainstorming and outlines.
Project & PlanningUser Journey
User experience map with satisfaction scores.
Project & PlanningKanban Board (Mermaid)
Lightweight kanban using mermaid block diagrams.
Project & PlanningGit Branch Graph
Branch and merge history visualisation.
Project & PlanningTheory of Change
Inputs → activities → outputs → outcomes → impact.
Research & AcademicRequirement Diagram
SysML-inspired requirement traceability.
Research & AcademicPie Chart
Categorical share — native Mermaid pie chart.
Scientific PlotsQuadrant Chart
2 × 2 prioritisation matrix (effort × impact, risk × reward).
Project & PlanningXY Chart
Native Mermaid line + bar chart for time series.
Scientific PlotsPacket Diagram (TCP header)
Bit-field layout of a TCP segment header.
Custom / SVGArchitecture Diagram
Mermaid's native architecture-beta — groups, services, and ports.
ArchitectureC4 — Component
C4 level-3 — components inside the Auth service.
ArchitectureC4 — Dynamic
Runtime interaction sequence in C4 notation.
ArchitectureC4 — Deployment
Deployment nodes hosting containers across environments.
ArchitectureBlock Diagram
Free-form block layout — useful for hardware block diagrams.
Custom / SVGRadar / Spider (Mermaid)
Mermaid-native radar chart — multi-axis profile comparison. (v11.6+)
Scientific PlotsTreemap (Mermaid)
Mermaid-native treemap for hierarchical proportions. (v11.6+)
Scientific PlotsKanban Board (native)
Native Mermaid kanban board with assignees / priorities / tickets. (v11.1+)
Project & PlanningIshikawa / Fishbone
Cause-and-effect / root-cause analysis fishbone. (v11.12+)
Research & AcademicVenn Diagram (Mermaid)
Mermaid-native Venn diagram. (v11.12+)
MathematicsWardley Map
Strategic Wardley map — value chain mapped to evolution. (v11.14+)
Project & PlanningEvent Modeling
Commands / events / views on a single timeline. (v11.15+)
ArchitectureTree View
Outline / tree view, e.g. file structures. (v11.14+)
Data & SchemaHand-drawn look (frontmatter)
YAML frontmatter selects the sketchy 'handDrawn' look + 'forest' theme + ELK layout engine.
Custom / SVGFlowchart Node Shapes (v11.3)
Showcase of 20+ named node shapes added in Mermaid 11.3 — manual-file, paper-tape, win-pane, brace, multi-doc, summary, hourglass, more.
Custom / SVGFlowchart — interactive + styled
Click events, animated edges, classDef-based theming, linkStyle, icon shapes via Iconify.
Flow & ProcessSequence — all advanced features
Box grouping, every actor type, autonumber w/ format, par/and, critical/option, break, activations, bidirectional, central lifeline, links.
UML & SoftwareClass — namespaces + generics + stereotypes
namespace blocks, generic types ~T~, every stereotype (<<interface>>, <<abstract>>, <<enumeration>>), visibility modifiers, all 8 relationships.
UML & SoftwareState — composite + parallel + choice/fork/join
Composite states, concurrent regions, <<choice>>, <<fork>>/<<join>>, notes on states.
UML & SoftwareGit graph — cherry-pick + orientation
Cherry-pick, branch ordering, vertical orientation (TB), commit types (HIGHLIGHT / REVERSE).
Project & PlanningStock & Flow (system dynamics)
System-dynamics-style stock-and-flow with rates affecting stocks.
Research & AcademicC4 Container Diagram
C4 model — container view of a typical SaaS application.
ArchitectureERD — Multi-tenant SaaS
Organisations, users, memberships, projects — classic multi-tenant model.
Data & SchemaGantt — Research Paper
12-week academic paper timeline with critical-path tasks.
Project & PlanningSequence — OAuth 2.0
Authorisation-code flow with PKCE and refresh.
UML & SoftwareMindmap — System Architecture
Hierarchical mindmap of a system's components.
ArchitectureUser Journey — Checkout
Emotional journey through a checkout flow.
Project & PlanningKanban Board
Four-column kanban with WIP markers.
Project & PlanningState — Pull Request
Pull-request state machine: open → review → merged / closed.
Flow & ProcessSankey — Annual Budget
Where the money goes — revenue, expenses, profit.
Data & SchemaQuadrant — Effort vs Impact
Two-axis prioritisation matrix.
Project & PlanningTimeline — Releases
Major release timeline for a product.
Project & PlanningFlowchart — Incident Response
Detect → triage → mitigate → postmortem.
Flow & ProcessFlowchart — CI/CD
Push → CI → tests → review → deploy stages.
Flow & ProcessClass — Payments Domain
Payment, Refund, PaymentMethod — typical domain model.
UML & SoftwareRAG — Retrieval-Augmented Generation
End-to-end RAG pipeline: ingest → embed → vector store → retrieve → LLM.
ArchitectureEvent Sourcing + CQRS
Command side writes events; read side projects them into query models.
ArchitectureHexagonal Architecture (Ports & Adapters)
Domain core surrounded by ports + adapters for I/O.
ArchitectureSaga — Distributed Transaction
Choreography saga with compensating actions on failure.
ArchitectureStrangler Fig Migration
Gradually replace a legacy monolith by routing slices to new services.
ArchitectureMulti-Region Failover
Active/passive multi-region with DNS failover and async replication.
ArchitectureServerless Architecture
API Gateway → Lambda → DynamoDB with async S3 and SQS workflows.
ArchitectureSTRIDE Threat Model
Threat-model a system using the STRIDE taxonomy.
ArchitectureTLS 1.3 Handshake
1-RTT TLS 1.3 handshake with key exchange and Application Data.
UML & SoftwareGitOps Deployment Flow
Push to Git → CI image build → manifests in repo → operator reconciles cluster.
Flow & ProcessCanary Deployment
Progressive rollout with metric gates and automatic rollback.
Flow & ProcessFeature Flag Decision
Runtime feature-flag evaluation with audience targeting.
Flow & ProcessTransformer Block
Pre-norm transformer block with multi-head attention + MLP and residuals.
ArchitectureFine-Tuning Workflow
From raw text to a deployed fine-tuned model with evaluation gates.
Flow & ProcessA/B Experiment Lifecycle
Hypothesis → sample size → run → analyse → ship / kill, with guardrails.
Research & AcademicSTROBE — Observational Study
Participant flow diagram for an observational cohort study (STROBE-style).
Research & AcademicARRIVE — Animal Study
Animal-allocation diagram following ARRIVE 2.0 reporting guidelines.
Research & AcademicTRIPOD — Prediction Model
Development + validation pipeline for a clinical prediction model.
Research & AcademicSPIRIT — Trial Schedule
SPIRIT schedule-of-enrolment, interventions, assessments.
Research & AcademicED Patient Pathway
Emergency-department pathway from arrival to disposition.
Life SciencesDrug Discovery Pipeline
Target ID → hit → lead → candidate → clinical.
Life SciencesRACI Matrix
Responsible / Accountable / Consulted / Informed across tasks and roles.
Project & PlanningSWOT Analysis — Quadrant Chart
Strengths, Weaknesses, Opportunities, Threats — 2x2 quadrant.
Project & PlanningBCG Growth-Share Matrix
Stars / Cash cows / Question marks / Dogs.
Project & PlanningETL Pipeline
Extract → transform → load with quality gates and observability.
Data & SchemaStar Schema
Canonical star — fact_sales at the centre, dimensions around it.
Data & SchemaAWS — 3-Tier Web App
Route 53 + CloudFront + ALB + ECS + RDS + ElastiCache across AZs.
ArchitectureAWS — Data Lake (medallion)
Bronze / Silver / Gold zones on S3 with Glue, Athena, and downstream BI/ML.
ArchitectureAWS — IoT Telemetry Pipeline
Devices → IoT Core → rules → Timestream + S3 + Lambda alerts.
ArchitectureAWS — Real-time Analytics
Kinesis stream → Flink → DynamoDB + S3 + OpenSearch dashboards.
ArchitectureAWS — ML Model Serving
SageMaker endpoint behind API Gateway with model registry + monitoring.
ArchitectureAWS Well-Architected — Five Pillars
The five pillars of AWS Well-Architected Framework as a mindmap.
ArchitecturePod Design Patterns
Init container, sidecar, ambassador, adapter — the four classic pod patterns.
ArchitectureOperator Reconcile Loop
Custom controller reconciling spec vs status until they converge.
ArchitectureCluster Networking
Ingress → Service → Pods, plus NetworkPolicy for east-west traffic.
ArchitectureHPA + VPA Autoscaling
Horizontal + vertical pod autoscaling driven by metrics-server.
ArchitectureOSI 7-Layer Model
Classic OSI stack with representative protocols at each layer.
ArchitectureSubnet Plan
Hierarchical breakdown of a /16 supernet into VPC subnets.
ArchitectureGDPR Data-Subject Rights
Process flow when a user invokes access / erasure / portability rights.
Flow & Process