Diagrams
Visualise architecture with Flowcharts, PlantUML, Mermaid, JSON graph and UML class diagrams
All 7 diagram tools run in your browser with no install, no account required. Design software architectures with Mermaid (flowcharts, ER, sequence, class, Gantt), render PlantUML diagrams, visualise JSON structures as interactive trees and graphs, and explore OpenAPI schemas as class diagrams — export to PNG or SVG with one click.
7 tools
JSON Visualizer
Visualize JSON as an interactive graph or UML class diagram with code export
JSON → Graph
Visualize any JSON as an interactive node-link graph
JSON → UML
Visualize JSON as a UML class diagram with language-aware types
OpenAPI Class Explorer
Browse schemas from an OpenAPI / Swagger spec and view UML class diagrams
Mermaid Diagram Editor
Create and render Mermaid diagrams — flowcharts, sequence diagrams, ER diagrams, class diagrams, Gantt charts and more
PlantUML Generator
Write and preview PlantUML diagrams
Diagram Studio
Create flowcharts, UML diagrams, ERDs, and system architecture diagrams with a drag-and-drop visual canvas
All categoriesOther categories
About Diagrams
A complete set of diagram and visualisation tools for developers, architects and technical writers. Create flowcharts, UML diagrams, ER schemas, JSON graphs and more — all 7 tools run client-side with no install, no server, no account required.
Features
- ✓Mermaid Diagram Editor — write Mermaid syntax and get live SVG previews; supports flowcharts, ER diagrams, sequence diagrams, class diagrams and Gantt charts
- ✓PlantUML renderer — paste PlantUML source and render sequence, class, component, state and activity diagrams via the plantuml.com server (no Java install needed)
- ✓JSON visualizer — render any JSON document as an interactive collapsible tree with search and expand/collapse controls
- ✓JSON graph — visualise JSON object relationships as a zoomable force-directed node-edge graph
- ✓JSON to UML — generate a UML class diagram from any JSON structure or TypeScript-style interface
- ✓OpenAPI class explorer — visualise request/response schemas from an OpenAPI / Swagger specification as interactive class diagrams
- ✓Diagram studio — general-purpose canvas editor with a shape library, connectors and routing for custom architecture diagrams
- ✓Share any diagram via a URL — source is encoded in the query string, no account or server storage required
- ✓Export all diagrams to PNG and SVG for use in documentation, presentations, Confluence, Notion and GitHub READMEs
Common Use Cases
- Design a microservices architecture diagram before implementation
- Document a REST API request/response flow with a sequence diagram for team review
- Model a database schema with an ER diagram before writing migrations
- Visualise a deeply-nested JSON API response as an interactive tree to understand the structure
- Render PlantUML diagrams from existing .puml files without installing Java or PlantUML
- Explore the data model in an OpenAPI spec as class diagrams during API integration
- Create a deployment flowchart for a CI/CD pipeline documentation page
Frequently Asked Questions
QCan I export diagrams to use in documentation?
Yes. All diagram tools support export to PNG and SVG, suitable for use in Confluence, Notion, GitHub README files, Google Docs and presentations.
QDoes the PlantUML tool require a local install?
No local install or Java runtime is needed. The PlantUML tool encodes your diagram source and sends it to the public plantuml.com rendering server, then displays the returned SVG. Your source is never stored — it is encoded directly in the share URL.
QWhat does the JSON graph tool show?
It renders the object/array structure of any JSON document as a force-directed node-edge graph, which is useful for understanding relationships in complex API responses and nested configuration objects.
See Also
- Mermaid Diagram EditorDesign flowcharts, ER diagrams, sequence diagrams and more
- PlantUML RendererRender PlantUML diagrams in your browser without Java
- JSON VisualizerRender JSON as an interactive collapsible tree
- OpenAPI ExplorerVisualise OpenAPI schemas as class diagrams
- Image & Media ToolsQR codes, screenshot beautifier, code-to-image and more