← All updates

More Mermaid diagram types

New Mermaid diagram types you can embed in Markdown → PDF.

mermaidmarkdowndiagrams

Markdown documents (POST /api/v1/md, the CLI, the blog) keep gaining Mermaid diagram types, each rendered as native PDF vector graphics — sharp at any zoom:

  • Timeline — chronological lanes of time periods with stacked event cards, optional section bands, and a cycled colour palette. Ideal for roadmaps, project histories, and release recaps.
  • Quadrant chart — a 2×2 matrix split by midlines into four tinted cells with quadrant labels and named points plotted in unit-square coordinates. Common in effort/impact and risk/reward prioritisation decks.
  • Sankey diagram (sankey-beta) — weighted flow diagrams that show how quantities move between nodes across layers. Ideal for budget breakdowns, energy flows, and resource allocation: each ribbon's thickness is proportional to the flow value, and nodes are automatically layered by longest-path depth.
  • Kanban board (kanban) — columns of task cards parsed from indentation, with word-wrapped labels, @{ assigned, ticket, priority } card metadata, and priority corner tags. Handy for sprint boards, launch checklists, and status snapshots.
  • Requirement diagram (requirementDiagram) — SysML-style requirement and element boxes (requirement, functionalRequirement, performanceRequirement, interfaceRequirement, physicalRequirement, designConstraint, element) connected by typed relations (contains, copies, derives, satisfies, verifies, refines, traces). Handy for traceability views in specs and design docs.
  • Treemap (treemap-beta) — nested rectangles sized by value for part-of-whole views of hierarchical data. Ideal for budget breakdowns, disk usage, and portfolio compositions: cell areas are proportional to values, branches sum bottom-up, and labels degrade gracefully on tiny cells.
  • Mindmap (mindmap) — indentation-defined hierarchies rendered as a branch-coloured node-link tree, with square, rounded, circle, and hexagon node shapes (bang and cloud nodes are drawn as approximations: a double ring and a pill). Handy for brainstorms, site maps, and plan breakdowns.
  • C4 architecture diagrams (C4Context / C4Container) — Person/System/Container/Component cards grouped in labelled boundaries and joined by labelled relationships, for system-context and container overviews in design docs.
  • User journey (journey) — sectioned tasks with 1–5 satisfaction scores plotted on a mood-coloured lane, with per-actor colour dots and a legend. Handy for day-in-the-life maps, onboarding walkthroughs, and experience reviews.
  • Radar chart (radar-beta) — spider charts that plot multiple series against shared radial axes. Ideal for skill assessments, product comparisons, and performance reviews: each series is a closed polygon in its own colour with a legend, over concentric circle or polygon graticules with an explicit or data-derived scale.
  • Block diagram (block-beta) — author-positioned grids for system overviews where automatic layout would move shapes somewhere unwanted. Blocks flow left-to-right across a fixed column count with wrapping, id:N column spans, space gaps, nestable block:label ... end sub-grids, and arrows between blocks. Ideal for software architectures, network layouts, and process flows.