Skip to main content

Excalidraw

Excalidraw renders a hand-drawn diagram from an Excalidraw JSON document.

Use this type​

Use this type when Excalidraw is the source editor for the diagram.

Source format​

The source format is Excalidraw JSON. Enter the source in the diagram.zip editor.

Syntax essentials​

  • Use an Excalidraw JSON object.
  • Put drawable objects in the elements array.
  • Put document settings in the appState object.
  • Keep element IDs unique.

Source structure​

This source shows the document structure. It is not a complete document.

{
  "type": "excalidraw",
  "version": 2,
  "elements": [],
  "appState": {
    "viewBackgroundColor": "#ffffff"
  }
}

The rendered view uses a complete project example for this diagram type.

Rendered exampleDrag to pan. Use the wheel or controls to zoom.
100%
This view uses the live diagram.zip renderer.

Upstream reference​

Excalidraw documentation