Skip to content

D2 Renderer

D2 is a modern diagram scripting language.

Usage

system-spec render system.json --format d2 > system.d2
d2 system.d2 system.svg
renderers := render.NewRenderers()
output, err := renderers.D2.Render(g)

Output Example

direction: right

classes: {
  service: {
    shape: rectangle
    style.fill: "#e1f5fe"
  }
  database: {
    shape: cylinder
    style.fill: "#fff3e0"
  }
}

svc_api: api { class: service }
svc_backend: backend { class: service }
rds_main_db: main-db { class: database }

svc_api -> svc_backend: grpc:8080
svc_backend -> rds_main_db

Node Shapes

Kind Shape
service rectangle
database cylinder
queue queue
storage stored_data
ai_model hexagon

Generating Images

# SVG (default)
d2 system.d2 system.svg

# PNG
d2 system.d2 system.png

# PDF
d2 system.d2 system.pdf

# With layout engine
d2 --layout=elk system.d2 system.svg

Customization

The D2 renderer can be customized:

renderer := render.NewD2Renderer()
renderer.Direction = "down"  // "right", "down", "left", "up"