ascii-art-alignment

Create perfectly aligned ASCII diagrams using the hybrid character strategy.

Repository: fabioc-aloha/Alex_Plug_In
Last source activity: April 15, 2026 at 05:03
Detected SKILL.md language: English
Stars: 5
Forks: 3

Install options

The review-first prompt is selected by default. You can switch to a direct command or download a local copy.

Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.

A direct command skips the review prompt. Inspect the source before running it.

npx skills add https://github.com/fabioc-aloha/Alex_Plug_In --skill ascii-art-alignment

The command stays on one line. Scroll horizontally to inspect it before copying.

Prefer a local copy? Download the files currently available to SkillsMP.

Review the source files

Read SKILL.md and any companion files shown by SkillsMP before deciding whether to install.

SKILL.md

Source instructions · Read-only preview

Back to search Back to installation

ascii-project-dashboard

Create and maintain ASCII visual dashboards for project tracking with parallel lane progress bars

2026-04-15

audio-memory

Store and manage voice samples for TTS cloning — portable, version-controlled audio references

2026-04-15

markdown-mermaid

Clear documentation through visual excellence

2026-04-15

View all from this repository

┌ ─ ┐    Top corners and horizontal
│        Vertical lines
└ ┘      Bottom corners
├ ┤      T-junctions (left/right)
┬ ┴      T-junctions (top/bottom)
┼        Cross junction

v    Down arrow (lowercase v)
^    Up arrow (caret)
<    Left arrow
>    Right arrow
<--> Bidirectional
---> Flow direction

Line X: │  ┌─────────┐    ┌─────────┐    │  = ?? chars
        ^                              ^
        Count from here                To here

┌───────────────────────────────────────┐  <- 41 chars
│  ┌─────────┐    ┌─────────┐    │      <- 40 chars (WRONG!)
└───────────────────────────────────────┘  <- 41 chars

$content = Get-Content "file.md"
$target = 67  # Your expected width
$content | ForEach-Object -Begin {$i=0} -Process {
    $i++
    if ($_ -match '^\│' -and $_.Length -ne $target) {
        "{0,4}: [{1}] {2}" -f $i, $_.Length, $_
    }
}

$content | Where-Object { $_ -match '^\│' } |
    Group-Object Length | Sort-Object Name |
    ForEach-Object { "{0} chars: {1} lines" -f $_.Name, $_.Count }

$valid = @(67, 75, 91)  # Multiple valid widths
$content | Where-Object { $_ -match '^\│' } | ForEach-Object {
    if ($_.Length -notin $valid) { "[$($_.Length)] $_" }
}

Select-String -Path "*.md" -Pattern '[▼▲◄►]' |
    Select-Object Filename, LineNumber, Line

┌─────────────────────────────────────────┐
│             ARCHITECTURE                │
├─────────────────────────────────────────┤
│                                         │
│  ┌───────────┐       ┌───────────┐      │
│  │ Component │ ----> │ Component │      │
│  │     A     │       │     B     │      │
│  └───────────┘       └───────────┘      │
│        │                   │            │
│        v                   v            │
│  ┌─────────────────────────────────┐    │
│  │          Shared Layer           │    │
│  └─────────────────────────────────┘    │
│                                         │
└─────────────────────────────────────────┘

┌─────────────────────────────┐    ┌─────────────────────────────┐
│          BEFORE             │    │           AFTER             │
├─────────────────────────────┤    ├─────────────────────────────┤
│                             │    │                             │
│  - Manual process           │    │  - Automated workflow       │
│  - Error prone              │    │  - Validated inputs         │
│  - Slow feedback            │    │  - Real-time feedback       │
│                             │    │                             │
└─────────────────────────────┘    └─────────────────────────────┘

┌─────────────────────────────────────────┐
│           PROJECT STATUS                │
├─────────────────────────────────────────┤
│                                         │
│  [x] Phase 1: Planning         DONE     │
│  [x] Phase 2: Design           DONE     │
│  [~] Phase 3: Development      75%      │
│  [ ] Phase 4: Testing          PENDING  │
│                                         │
│  Legend: [x]=Done [~]=Progress [ ]=Todo │
│                                         │
└─────────────────────────────────────────┘

┌───────────────────────────────────────────────────────────────┐
│                   DATA PROCESSING PIPELINE                    │
├───────────────────────────────────────────────────────────────┤
│                                                               │
│  ┌─────────┐    ┌─────────┐    ┌─────────┐    ┌─────────┐     │
│  │  INPUT  │--->│ VALIDATE│--->│ PROCESS │--->│ OUTPUT  │     │
│  └────┬────┘    └────┬────┘    └────┬────┘    └────┬────┘     │
│       │              │              │              │          │
│       v              v              v              v          │
│  ┌─────────┐    ┌─────────┐    ┌─────────┐    ┌─────────┐     │
│  │   Raw   │    │  Clean  │    │ Enriched│    │  Final  │     │
│  └─────────┘    └─────────┘    └─────────┘    └─────────┘     │
│                                                               │
└───────────────────────────────────────────────────────────────┘

Diagram Type	Use	Reason
Flow charts	Mermaid	Auto-layout, interactive, GitHub-native
Gantt/Timeline	Mermaid	Native support, date handling
Sequence diagrams	Mermaid	Lifelines, activation bars
State machines	Mermaid	Standard notation, auto-routing
ER diagrams	Mermaid	Relationship cardinality notation
UI Mockups	ASCII	Precise pixel-level layout control
Conversation mockups	ASCII	Text-heavy, spacing matters per-character
Feature lists in boxes	ASCII	Better for bullet lists inside boxes
Simple architecture	Either	Mermaid for auto-layout, ASCII for exact control
Inline code comments	ASCII	Can't embed Mermaid in source code
Terminal output	ASCII	Rendered in monospace, no Mermaid support

❌ WRONG:
│ ✅ Complete │  <- Misaligned (emoji width varies)

✅ CORRECT:
│ [x] Complete │  <- Aligned

❌ WRONG:
│     ▼        │  <- Misaligned (arrow width varies)

✅ CORRECT:
│     v        │  <- Aligned

name	ascii-art-alignment
description	Create perfectly aligned ASCII diagrams using the hybrid character strategy.
tier	extended
applyTo	*/ascii,/diagram,/box-drawing*

Use Case	Format	Reason
Architecture diagrams	Mermaid	Auto-layout, renderable, LLM-readable
Flowcharts / sequences	Mermaid	Native tooling (`renderMermaidDiagram`)
Relationship maps	Mermaid	ER, class, graph diagrams
Branded visuals / logos	SVG	Scalable, animatable, platform-specific
Infographics / illustrations	SVG	Full design control, dark/light mode

name	ascii-art-alignment
description	Create perfectly aligned ASCII diagrams using the hybrid character strategy.
tier	extended
applyTo	*/ascii,/diagram,/box-drawing*

Use Case	Format	Reason
Architecture diagrams	Mermaid	Auto-layout, renderable, LLM-readable
Flowcharts / sequences	Mermaid	Native tooling (`renderMermaidDiagram`)
Relationship maps	Mermaid	ER, class, graph diagrams
Branded visuals / logos	SVG	Scalable, animatable, platform-specific
Infographics / illustrations	SVG	Full design control, dark/light mode

Bad	Problem	Good Alternative
`▼ ▲ ◄ ►`	Triangle arrows render as 2 chars	`v ^ < >`
`→ ← ↑ ↓`	Arrow symbols inconsistent width	`> < ^ v`
`◄──►`	Mixed arrows = guaranteed misalign	`<-->`

ascii-art-alignment

Install options

Review the source files