Create and control a diagram.
Diagram.zip is a browser-based diagram editor. Write or paste source, see the result, then save or share it.
Find a topic
- Create: choose a diagram type and learn its short syntax guide.
- Style: set common presentation options, then use type-specific settings.
- Share: understand read links, edit links, encryption, and saved state.
The pages use short examples and direct links. Agents can use the same stable URLs and code blocks.
30 supported types
Choose a diagram type
UML and architecture
PlantUML
PlantUML creates UML and related diagrams from directives and relationships.
General diagrams
Mermaid
Mermaid creates diagrams with compact, Markdown-friendly text.
Graphs and networks
Graphviz
Graphviz creates directed and undirected graphs from the DOT language.
General diagrams
D2
D2 creates modern diagrams from declarations, connections, containers, and style properties.
UML and architecture
C4 PlantUML
C4 PlantUML creates C4 software architecture diagrams with PlantUML macros.
Process and infrastructure
BlockDiag
BlockDiag creates block diagrams with automatic layout.
Process and infrastructure
SeqDiag
SeqDiag creates sequence diagrams from message statements.
Process and infrastructure
ActDiag
ActDiag creates activity diagrams with actions and lanes.
Process and infrastructure
NwDiag
NwDiag creates network diagrams from networks, addresses, and hosts.
Process and infrastructure
PacketDiag
PacketDiag creates bit-field layouts for packets and binary records.
Process and infrastructure
RackDiag
RackDiag creates equipment-rack diagrams from rack-unit positions.
Process and infrastructure
BPMN
BPMN renders a BPMN 2.0 process definition from XML.
Data and hardware
Bytefield
Bytefield creates byte-oriented protocol diagrams from drawing forms.
Data and hardware
DBML
DBML creates database schemas from tables, fields, enums, indexes, and references.
General diagrams
Diagrams.net
Diagrams.net renders a diagram from its native XML document.
Text sketches
Ditaa
Ditaa converts an ASCII-art drawing into a clean diagram.
Data and hardware
ERD
ERD creates entity-relationship diagrams from entities, attributes, and cardinalities.
General diagrams
Excalidraw
Excalidraw renders a hand-drawn diagram from an Excalidraw JSON document.
Text sketches
GoAT
GoAT converts ASCII-art diagrams into SVG.
UML and architecture
Nomnoml
Nomnoml creates UML-style diagrams from bracketed classifiers and relationships.
General diagrams
Pikchr
Pikchr creates precise technical drawings from relative placement commands.
UML and architecture
Structurizr
Structurizr creates C4 architecture views from a workspace model.
Text sketches
Svgbob
Svgbob converts ASCII-art diagrams into SVG.
Data and hardware
Symbolator
Symbolator creates a component symbol from a hardware module declaration.
General diagrams
TikZ
TikZ creates precise diagrams with TeX drawing commands.
UML and architecture
UMLet
UMLet renders UML elements from a UXF XML document.
Data and hardware
Vega
Vega creates data visualizations from a declarative JSON specification.
Data and hardware
Vega-Lite
Vega-Lite creates data visualizations from concise mark and encoding declarations.
Data and hardware
WaveDrom
WaveDrom creates digital timing diagrams from signal and wave data.
Data and hardware
WireViz
WireViz creates wiring-harness diagrams from connectors, cables, and connections.
Showing 30 of 30 diagram types
Next steps
Read how to create a diagram, or learn how to share a diagram.