Welcome to tldiagram

tldiagram is a high-performance interactive diagramming tool built on the C4 model. Define your services, databases, people, and message queues once - then compose them across multiple diagrams and link nodes to drill into sub-diagrams.

What you can do

• Define objects - services, databases, people, queues, and custom types with icons
• Draw edges - directed or undirected, with optional labels
• Nest diagrams - link any node to a child diagram for C4-style drill-down
• Freestyle drawing - annotate diagrams with a freehand drawing layer
• Share - generate read-only share links for stakeholders
• Link Git source - link elements directly to source code repositories for quick access

Quick start

1. Sign up at tldiagram.com/app
2. Create your first diagram from the dashboard
3. Read the Editor Usage guide to learn about keyboard shortcuts and interactions
4. Open the Object Library drawer and add your first object
5. Drag a second object onto the canvas and draw an edge between them
6. Click any node to open its properties panel

Core Concepts & Architecture

To fully leverage tldiagram for complex systems, we highly recommend reading our architecture guides:

• Core Concepts: Understand the diagram hierarchy, atomic reparenting, and the difference between structural links and soft portal links.
• Collaboration & Organization: Learn how real-time WebSockets editing works, and how to manage Workspaces, Organizations, and versioning.
• Platform Services: Discover the advanced backend services that power notifications, dependency tracking, device management, and billing tiers.

Extensions & Tools

• VS Code Extension: View and interact with your diagrams directly inside VS Code.
• CLI Tool: Generate and manage diagrams from your terminal using AI.