d2

Convert D2 declarative text specifications into structured diagrams.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/bugabinga/pi-ext --skill d2-bugabinga
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: d2
Source: https://github.com/bugabinga/pi-ext/tree/main/skills/d2
Command: npx skills add https://github.com/bugabinga/pi-ext --skill d2-bugabinga

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It eliminates the slow, error-prone process of manually designing diagrams by letting you describe diagram structure and styling as text and then render the result consistently.

Core Features & Use Cases

  • Declarative diagram authoring: define shapes, labels, and connections in a compact D2 syntax for architecture, flows, and system visuals.
  • Rich node and container modeling: nest containers, reference parent containers, and reuse structured layout patterns for complex diagrams.
  • Built-in diagram types and domain patterns: model SQL tables, UML classes, and sequence diagrams, including visibility and constraint conventions.

Quick Start

Generate a D2 architecture diagram by asking: render this D2 code into an SVG: “direction: right; Client -> Server: Request; Server -> Database: Query; Database -> Server: Result; Server -> Client: Response”.

Frequently Asked Questions about d2

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate system architecture diagrams from text?

To generate system architecture diagrams from text, use D2 declarative syntax to define shapes, labels, and connections, then render the result instantly into a structured visual format for documentation.

Can I model SQL table diagrams and UML class diagrams using text?

Yes, you can model SQL table diagrams and UML class diagrams using D2 text syntax, applying built-in domain patterns for database tables, UML classes, and sequence diagrams including visibility and constraint conventions.

What is the best way to visualize data flow diagrams without manual design?

The best way to visualize data flow diagrams without manual design is converting D2 declarative text specifications into clear, structured diagrams, eliminating the slow and error-prone process of manual diagramming.

Does D2 syntax support nested containers for complex system architecture diagrams?

D2 syntax supports nested containers for complex system architecture diagrams, allowing you to nest containers, reference parent containers, and reuse structured layout patterns for rich node and container modeling.

How do I render sequence diagrams from declarative syntax?

You render sequence diagrams from declarative syntax by writing D2 text specifications that define the interactions, then using layout engines and rendering tooling support to produce the chosen output format like SVG.