Shape variations (D2)

Updated
View as text
Open in Confluence
Open in ChatGPT Open in Claude

Every shape D2 offers, in one diagram, so you can see what each looks like before choosing one.

#What this example shows

  • The full built-in shape vocabulary.

  • How each shape reads at a glance.

  • A diagram you can copy and prune down to the shapes you need.

#A worked example

Open it, edit it, or copy the source below.

Shape variations (D2)

The source, which you can paste into a new diagram and edit:

direction: right

basic: Basic {
  rect: rectangle {shape: rectangle}
  square: square {shape: square}
  circle: circle {shape: circle}
  oval: oval {shape: oval}
  diamond: diamond {shape: diamond}
}

data: Data and storage {
  cyl: cylinder {shape: cylinder}
  stored: stored_data {shape: stored_data}
  page: page {shape: page}
  doc: document {shape: document}
}

system: System {
  hex: hexagon {shape: hexagon}
  pkg: package {shape: package}
  step: step {shape: step}
  queue: queue {shape: queue}
  cloud: cloud {shape: cloud}
  person: person {shape: person}
}

callout: Callouts {
  callout: callout {shape: callout}
  parallelogram: parallelogram {shape: parallelogram}
}

#Making it your own

  • Pick shapes that carry meaning; a cylinder for a database is understood everywhere.

  • Do not invent private shape meanings. Nobody will read the legend.

  • Copy this page and delete what you do not need as a starting palette.

Nesting is the whole idea.