Topics / #diagramming

Diagramming projects on GitHub

Languages and libraries that generate diagrams from text or code.

As of , the most-starred Diagramming projects on GitHub are diagram-design (56.4K stars), d2 (25.6K stars) and chartdb (23K stars). GitHub.Locker tracks 8 Diagramming repositories with 137.1K stars combined. The fastest-growing on October 16 was diagram-design, with +502 stars in a day.

8Projects
137.1KStars in total
+517Stars in a day
Browse in the catalog →github.com/topics/diagramming ↗

Hot right now

Most stars gained in a day · Oct 16

+502

diagram-design

cathrynlavery/diagram-design · ★ 56.4K

Diagram Design is an Agent Skill that lets AI coding agents (Claude Code, Codex, Factory Droid, Pi) generate editorial-quality diagrams — 39 types including architecture, flowchart, Gantt, UML class and database schema — as self-contained HTML+SVG files with no Mermaid, no Figma, and no generic rounded boxes.

+5

architecture-diagram-generator

Cocoon-AI/architecture-diagram-generator · ★ 7.4K

It's a Claude AI skill that turns a plain-English description of your system into a beautiful, dark-themed architecture diagram, rendered as a standalone HTML/SVG file you can open in any browser.

+3

chartdb

chartdb/chartdb · ★ 23K

ChartDB is a web-based database diagramming editor: run one query against your database, paste the returned JSON, and your schema becomes an interactive diagram you can edit and export as SQL scripts. No account required.

+3

LogicFlow

didi/LogicFlow · ★ 11.7K

LogicFlow is an open-source flow chart editing framework: it provides the interactions and editing features flowcharts need, plus flexible node customization and plugins, so you can add flowchart-style editing to your own business system.

The all-time top

8 projects · by stars

  1. #1 · cathrynlavery/diagram-design

    diagram-design

    Diagram Design is an Agent Skill that lets AI coding agents (Claude Code, Codex, Factory Droid, Pi) generate editorial-quality diagrams — 39 types including architecture, flowchart, Gantt, UML class and database schema — as self-contained HTML+SVG files with no Mermaid, no Figma, and no generic rounded boxes.

    56.4K
  2. #2 · d2lang/d2

    d2

    D2 is an open-source diagram scripting language: you describe a diagram as plain text in a .d2 file, and it renders that text into a real diagram.

    25.6K
  3. #3 · chartdb/chartdb

    chartdb

    ChartDB is a web-based database diagramming editor: run one query against your database, paste the returned JSON, and your schema becomes an interactive diagram you can edit and export as SQL scripts. No account required.

    23K
  1. 4

    flowy

    12.1Kalyssaxuu/flowy · JavaScript

    Flowy is a minimal JavaScript library for building flowcharts in web apps: users drag blocks onto a canvas, snap them together, and rearrange them.

  2. 5

    LogicFlow

    11.7Kdidi/LogicFlow · TypeScript

    LogicFlow is an open-source flow chart editing framework: it provides the interactions and editing features flowcharts need, plus flexible node customization and plugins, so you can add flowchart-style editing to your own business system.

  3. 6

    architecture-diagram-generator

    7.4KCocoon-AI/architecture-diagram-generator · HTML

    It's a Claude AI skill that turns a plain-English description of your system into a beautiful, dark-themed architecture diagram, rendered as a standalone HTML/SVG file you can open in any browser.

  4. 7

    system-atlas

    438inkboard/system-atlas · HTML

    An agent skill that turns an architecture discussion into an explorable isometric atlas: one data file produces both an interactive HTML map and a generated SYSTEM.md text twin.

  5. 8

    graph

    246statelyai/graph · TypeScript

    A TypeScript library providing universal utilities for working with graphs: a plain {nodes, edges} JSON data model plus algorithms, format converters, and layout engines to actually use that data.

Often tagged together