DiaGrammar
New diagram
Actions

Layercake DSL

Source

Saved locally

Loading the default project…

Live preview

FORMATION Architecture

Style

Cloud account

Your DiaGrammar account

Sign in to keep your diagrams attached to your account and available on every device.

Reference

Layercake DSL

Layercake is DiaGrammar's line-oriented format for architecture diagrams made from nested boxes. Indentation is optional, but two spaces per level makes source easier to scan.

Document structure

Start with layercake and a unique ID. Use end to close every container, including the document. 

layercake warehouse
  title "Warehouse architecture"
  preset diagrammar

  row
    box services["SERVICES"]
      api["API"]
    end
  end
end

Available presets are diagrammar, blueprint, boardroom, and mono.

Comments

%% starts a full-line or inline comment.

%% This whole line is ignored.
row %% The main two-column layout

Rows and columns

row and column are invisible layout containers. Nest them to create two-dimensional layouts without coordinates. Both may have an ID and title. 

row
  column core["CORE"] grow=3
    box app["APPLICATION"]
      web["Web app"]
    end
  end
  column external["INTEGRATION"] grow=1
    box erp["EXTERNAL SYSTEMS"]
      system["ERP"]
    end
  end
end

Boxes and nodes

A box is a visible titled container. Its direct children flow horizontally by default. Add flow=column for a vertical stack. 

box tracking["TRACKING"] role=input
  gps["GPS"]
  ble["Bluetooth"]
end

IDs start with a letter and may contain letters, numbers, underscores, and hyphens. Each ID must be unique. Use \n inside a label for an intentional line break.

Layout options

Option Values
flowrow, column
growAny positive number
align start, center, end, stretch
justify start, center, end, between, around, evenly
wraptrue, false
gapsm, md, lg
roleA semantic color role

Built-in roles are application, platform, hub, input, events, and external.

Connections

Connect nodes by their stable IDs. Labels are optional.

api --> database
api -->|writes| database

Saving and exporting

Projects are saved in this browser and are not uploaded. Export DiaGrammar source or project JSON for a portable backup. You can also export a self-contained HTML page or PNG image.