Every diagram type.
zombie-mermaid renders 10 Mermaid diagram types, each with a live picker across every one of its 15 built-in themes.
View all diagramsFlowchart
Flowcharts map a process as boxes and arrows and are the most commonly used Mermaid diagram — CI pipelines, decision trees, onboarding steps. zombie-mermaid supports the full shape set (rounded, diamond, stadium, subroutine, cylinder, hexagon, and more), subgraphs, and both straight and curved edges.
State diagram
State diagrams show every state a system can be in and the events that move it between them — useful for anything with a lifecycle: a connection, an order, a UI component. zombie-mermaid supports nested composite states, start/end pseudostates, and animated edge transitions.
Sequence diagram
Sequence diagrams show the order messages pass between participants over time — the standard way to document an API call, an auth handshake, or a distributed-systems trace. zombie-mermaid supports actors, activation boxes, and every Mermaid arrow type.
Class diagram
Class diagrams document a type’s attributes, methods, and visibility in a compact, 3-compartment box — the standard UML notation for object-oriented design docs and API references. zombie-mermaid renders all four visibility markers and inheritance/composition relationships.
ER diagram
Entity-relationship diagrams describe a database schema: entities, their attributes, and the cardinality of the relationships between them. zombie-mermaid renders the full crow’s-foot notation along with PK/FK/UK key badges on typed attributes.
XY chart
XY charts plot bar and line series against a shared axis — the one Mermaid diagram type that’s a data chart rather than a graph of nodes and edges. zombie-mermaid renders both bar and line series, mixed on one chart if needed.
C4 diagram
C4 diagrams describe software architecture as people, systems, containers, and components, zoomed in one level at a time. zombie-mermaid renders the Context, Container, Component, and Dynamic variants with boundaries and labelled relationships.
Architecture diagram
Architecture diagrams place services in groups and connect them from a chosen side of each, which suits cloud and infrastructure layouts. zombie-mermaid renders groups, services, junctions, and edges between any of them.
Pie chart
Pie charts show how a whole divides into labelled parts. zombie-mermaid renders SVG wedges with a legend and, in ASCII, a proportional bar chart, with optional raw values via showData.
Quadrant chart
Quadrant charts place labelled points on two axes split into four named quadrants, the classic prioritisation matrix. zombie-mermaid renders the quadrants, axis labels and point styles in SVG and as a character grid in ASCII.