shubhamgrg04 / awesome-diagramming

A curated collection of diagramming tools used by leading software engineering teams

Awesome Diagramming

A curated list of awesome diagramming tools available for software engineering teams. Feel free to contribute to this on-going list.

When diagrams are useful?

Diagrams are faster and compact way for knowledge transfer. It's much easier to convey system architechture with a diagram compared to writing an essay on it.

Diagrams are especially useful in providing high level overview of software design. Following are the most-widely used diagrams by engineering teams:

• Sequence diagram - to visualize interaction between different components in a sequential order
• System architecture diagram - to visualize system architecture
• ER diagram - to visualize data models
• Gantt diagram - used for project planning and timeline estimation

Factors to consider before choosing the diagramming tool

• Free / Freemium / Paid
• Open source or Closed source
• Ease of use
• Diagram as code vs Hand drawn
• Visual Appearance - Modern / Minimalistic / Outdated / Hand-drawn

General Purpose (flexible for all kinds of diagrams)

• Kroki (Free, Open Source, Diagram as code, Ease of use - Easy, Visual Appearance - Flexible).
  Examples - Link

• Mermaid (Free, Open Source, Diagram as code, Ease of use - Easy, Visual Appearance - Modern).
  Examples - Link

• Excalidraw (Freemium, Open Source, Hand drawn, Ease of use - Easy, Visual Appearance - Hand-drawn).
  Examples - Link

• PlantUML (Free, Open Source, Diagram as code, Ease of use - Intermediete, Visual Appearance - Outdated)
  Examples - Link, Link

• Draw.io (Free, Open Source (But Closed To Contribution), Hand drawn, Ease of use - Moderate, Visual Appearance - Modern).
  Examples - Link

• Nomnoml (Free, Open Source, Diagram as code. Ease of use - Easy, Visual Apperance - Minimalistic).
  Examples - Link

• Diagram.codes (Freemium, Closed Source, Diagram as code, Ease of use - Easy, Visual Appearance - Outdated).
  Examples - Link

• Lucidchart (Paid, Closed Source, Hand drawn, Ease of use - Easy, Visual Appearance - Modern).
  Examples - Link

• Blockdiag (Free, Open Source, Diagram as code, Ease of use - Easy, Visual Appearance - Outdated).
  Exampes - Link

Others - Miro, Gliffy, Inkscape, Plectica, Whimsical, ZenUML, Gleek, Structurizr, StarUML

Sequence diagram

• Swimlanes (Free, Closed Source, Ease of use - Easy, Visual Appearance - Modern)
  Examples - Link

Others - Websequencediagrams, Sequencediagram.org

System design diagram

Essential readings
C4 Model, 5 types of architecture diagrams

• Diagrams (Free, Open Source, Ease of use - Easy, Visual Appearance - Modern).
  Examples - Link

• Terrastruct (Paid, Closed Source, Ease of use - Easy, Visual Appearance - Modern)
  Examples - Link

• IcePanel (Paid, Closed Source, Hand drawn, Ease of use - Easy, Visual Appearance - Modern) Examples - Link

• Lucidscale (Paid, Closed Source, Ease of use - Intermediete, Visual Appearance - Modern).
  Examples - Link

Others - Ilograph, Omnigraffle, Cloudcraft, CloudSkew

ER diagram

Essential Readings
How to choose your ERD?

• DbDiagram (Freemium, Closed Source, Ease of use - Easy, Visual Appearance - Modern)
  Examples - Link

• Azimutt (Free, Open Source, Ease of use - Easy, Visual Appearance - Modern).
  Examples - Link

  Azimutt is useful when you want to visualize existing database

• QuickDBD (Free, Closed Source, Ease of use - Easy, Visual Appearance - Modern).
  Examples - Link

Others - DrawSql, ERD Plus, Creately, SqlDBM

Gantt Chart

• Markwhen (Free, Open Source, Ease of use - Easy, Visual Appearance - Minimalist)
  Examples - Link

Other good curated collections of diagramming tools

• https://github.com/sw-yx/spark-joy/blob/master/README.md#diagramming
• https://xosh.org/text-to-diagram/