tspader avatar

diagrams

Use when generating any diagrams using ASCII and Unicode characters.

by tspader|Open Source

Diagrams

Quick Reference

Box drawing (single):

┌───┬───┐
│   │   │
├───┼───┤
│   │   │
└───┴───┘

Box drawing (double):

╔═══╦═══╗
║   ║   ║
╠═══╬═══╣
║   ║   ║
╚═══╩═══╝

Tree characters: ├── └── │

Arrows: → ← ↑ ↓ ↔ ↕ ⟶ ⟵

Blocks: █ ▀ ▄ ▌ ▐ ░ ▒ ▓

Diagram Types

TypeUse CaseReference
Memory layoutsStruct fields, memory regions, pointersmemory-layouts.md
Bit layoutsRegister bits, flags, binary formatsbit-layouts.md
Boxes/frames/tablesBordered text, headers, data tablesboxes-frames.md
BannersLarge text logos, titlesbanners.md
FlowchartsProcess flows, decisionsflowcharts.md
TreesDirectory structure, hierarchiestrees.md
SequencesMessage flows, timelinessequences.md

Full character reference: characters.md

Guidelines

  • Width: Keep under 80 chars for code comments, 120 for documentation
  • Alignment: All box characters assume monospace font
  • ASCII fallback: Use +, -, | when Unicode unavailable
  • Consistency: Pick single or double line style, don't mix within a diagram