Documentation

Variables

Variables are enclosed in curly braces. They resolve to numeric values based on the subnet's network address, prefix length, or metadata.

Variable	Description	Example (10.0.5.128/26)
{o1}	First octet of the network address	10
{o2}	Second octet	0
{o3}	Third octet	5
{o4}	Fourth octet	128
{o3 l}	Left digit of third octet	0 (from "5")
{o3 r}	Right digit of third octet	5
{o3 ll}	Left two digits of third octet	NaN (single digit)
{o3 rr}	Right two digits of third octet	5
{mask}	CIDR prefix length	26
{id}	Section ID (parsed as integer)	Depends on entry
{seq S:N}	Sequential generator: S + N * leafIndex	Varies by row

Operators

VML supports three arithmetic operators. Evaluation is strictly left-to-right (no operator precedence). Adjacent tokens with no operator are concatenated as strings.

Operator	Meaning
+	Addition
-	Subtraction
*	Multiplication

Examples

Template	Input subnet	Result
{o3}	10.0.5.0/24	5
100+{o3}	10.0.5.0/24	105
{o3}*100+{o4}	10.0.5.128/26	628
{seq 100:1}	(any, row 0)	100
{seq 100:1}	(any, row 1)	101
{seq 100:1}	(any, row 2)	102
{id}*100+{o3}	10.0.5.0/24, ID=2	205

Presets

The VLAN settings menu includes preset templates for common patterns:

Preset	Template
Third Octet	{o3}
Site + Octet	{id}*100+{o3}
Site Offset	{id}+{o3}
Sequential	{seq 100:1}
Octet Base 100	{o3}+100
Fourth Octet	{o4}+{mask}

Sibling

Mergeable sibling pairs share a color from the palette. Colors cycle through the theme and restart per tree section. This is the default mode — it visually groups pairs that can be joined.

Siblings & Cousins

Consecutive rows at the same prefix length share a color. Groups subnets at the same depth in the tree, regardless of whether they are direct siblings.

Cycle

Each row gets the next palette color sequentially, wrapping around at the end. Unlike Sibling (which pairs mergeable neighbors) or Cousins (which groups by depth), Cycle assigns one color per row regardless of tree structure.

Alternating Colors

Rows alternate between two user-chosen colors. Pick any two colors from the color controls. Useful for a clean, simple look without tree-structure information.

Zebra

Classic gray/white alternating stripes. Ignores the theme palette entirely and adapts to dark or light mode automatically.

Manual

Each row can be assigned a custom color individually. A paint bucket icon appears on each row for color selection. Rows without a manual color fall back to zebra stripes.

None

All rows use a uniform gray. No color differentiation. Useful for export or when colors are distracting.

Undo/Redo details

The undo system maintains an 8-level in-memory stack. Every action (split, join, edit a name, change a color, reorder columns) captures a full state snapshot. Undo restores the previous snapshot; redo reverses the undo.

Taking a new action after undoing clears the redo stack — the standard behavior users expect. The undo/redo state is held in memory only and does not persist across page reloads.

Save

Downloads a .json configuration file containing your complete state: all subnets, names, descriptions, notes, VLAN settings, column order, visibility, color mode, and theme. The file is typically 5–10 KB.

Load

Uploads a previously saved .json file and restores the full state. The file is validated before loading: node count limits, column allowlists, CIDR format checks, hex color validation, tree topology verification, and cross-tree ID uniqueness are all enforced. Invalid configs are rejected with an error message.

Export (CSV)

Downloads a .csv file with all currently visible columns. Hidden columns are excluded. The export respects your active display settings (range format, number format). CSV fields are escaped to prevent formula injection in spreadsheet applications.

Autosave

After every action, the complete state is serialized and written to localStorage. Refresh the page or close and reopen the tab — everything comes back exactly as you left it. No manual save required.

Autosave is purely local to your browser. Clearing browser data or switching browsers will lose the autosaved state. Use the Save button to create a portable backup.