JSON structure (PlantUML)

PlantUML renders JSON directly, which turns an unreadable payload into something a reader can scan. It is the quickest way to document an API response.

#What this example shows

• Real JSON as the source, so it can be copied from an actual response.

• Nested objects and arrays rendered as a tree.

• A structure that stays correct because it is the payload.

#A worked example

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

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

@startjson
{
  "id": "evt_01J8ZC",
  "type": "order.paid",
  "created": "2026-09-01T14:22:41Z",
  "data": {
    "order": {
      "id": "4c1e-88fa",
      "status": "paid",
      "total": 148.50,
      "currency": "GBP",
      "items": [
        { "sku": "KB-104", "quantity": 1, "unitPrice": 129.00 },
        { "sku": "CB-USB-2M", "quantity": 2, "unitPrice": 9.75 }
      ]
    },
    "customer": {
      "id": "cus_8812",
      "email": "alice@example.com",
      "tier": "standard"
    }
  },
  "livemode": true
}
@endjson

#Making it your own

• Paste a real response rather than writing one; that is the point.

• Mark optional fields in the surrounding text; JSON cannot express optionality.

• @startjson replaces @startuml for this diagram type.

#Related

Verbose, stable, and it draws almost everything.