Published on 2026-02-22

Nomnoml Diagrams in Markdown

A sassy, fast, and highly customizable UML diagram generator directly from text.

Nomnoml is an incredibly fast, lightweight text-to-UML tool. While PlantUML is massive and feature-rich, Nomnoml aims for simplicity and a distinctive, hand-drawn aesthetic (though it can be styled strictly).

It is particularly beloved for quickly sketching class diagrams, state machines, and simple architectures without the verbose syntax of other languages.

Wrap your code in a nomnoml block to render it.

Basic Syntax

The most basic element is a box, denoted by square brackets [Box]. You connect them with directed arrows ->.

syntax

[Pirate] -> [Plunder]
[Pirate] -> [Rum]
[Plunder] -> [Bounty]
[Rum] -> [Drunk]

UML Classes

Nomnoml was born to write UML classes. You divide sections of a class (Name, Attributes, Methods) using the pipe character |.

syntax

[<abstract>Vehicle|
  + weight: float
  - fuel: float
|
  + start()
  # drive()
]

[Car] -:> [Vehicle]
[Bike] -:> [Vehicle]

Notice the -:> arrow—it visually represents the hollow-triangle arrow used in UML for inheritance (a Car is a Vehicle).

Grouping and Nesting

A unique strength of Nomnoml is that it supports deeply nested boxes. If you want to put a box inside a box, literally wrap it in square brackets.

syntax

[Database |
  [Customers |
    [ID] -> [Name]
  ]
  [Orders |
    [OrderID] -> [CustomerID]
  ]
]

[Server] -> [Database]

Directives and Styling

You can style the diagram using “directives” starting with #. This allows you to set the background gradient, the stroke color, the stroke width, and the font.

syntax

#bg: #eeeef0
#stroke: #bf0603
#font: monospace
#lineWidth: 2

[<start>st] -> [State 1]
[State 1] -> [State 2]
[State 2] -> [<end>e]

Supported Arrow Types

Nomnoml supports numerous relationship indicators:

-> directed arrow
--> dashed arrow
-:> inheritance (hollow triangle)
--:> implements (dashed inheritance)
-+ composition (diamond)
o- aggregation (hollow diamond)

Nomnoml is perfect when you need a UML diagram fast, without having to consult documentation for complex syntax rules.