陌讯skills聚合平台

unicode-box-drawing

📁 andredezzy/maccing 📅 Jan 27, 2026
1
总安装量
1
周安装量
#46716
全站排名
安装命令
npx skills add https://github.com/andredezzy/maccing --skill unicode-box-drawing

Agent 安装分布

opencode 1
cursor 1
github-copilot 1
claude-code 1

Skill 文档

Unicode Box Drawing Patterns

Guidelines for creating properly aligned, readable Unicode box diagrams.

When to Apply

  • Drawing ASCII/Unicode diagrams in code comments or documentation
  • Creating flow charts, state machines, or architecture diagrams
  • Documenting CLI output formats or terminal interfaces
  • Building text-based UI mockups
  • Reviewing diagram alignment issues
  • Writing technical documentation with visual structures

Rule Categories by Priority

Priority Prefix Category
CRITICAL padding- Right-padding and fixed width alignment
HIGH spacing- Breathing room and whitespace
HIGH layout- Centering and nested box calculations
MEDIUM chars- Character selection and consistency

Quick Reference

Critical Rules

Rule ID Description
padding-right Every content line MUST be padded to full width before closing │
padding-fixed-width All lines in a box MUST have identical character count

High Priority Rules

Rule ID Description
spacing-breathing-room Empty line after ┌───┐ or ├───┤, and before └───┘ or ├───┤
layout-centering Always center nested boxes and flow diagrams within parent
layout-width-limit Keep diagrams under 70 characters for compatibility
layout-nested-math Calculate: left_pad + inner_content + right_pad = content_width

Character Rules

Rule ID Description
chars-single-set Never mix Unicode box chars with ASCII on same line
chars-light-lines Use light lines (─ │ ┌ ┐ └ ┘) for best compatibility
chars-monospace Only renders correctly in monospace fonts

Box Width Formula

Border formula:    ┌ + (width-2 × ─) + ┐ = total width
Content formula:   │ + (width-2 chars) + │ = total width
                       ↑
                       Content + right-padding spaces

For a 65-character wide box:

  • Border: ┌ + 63×─ + ┐ = 65 chars
  • Content: │ + 63 chars (content + padding) + │ = 65 chars

Unicode Characters Reference

Light Lines (Recommended)

Corners:     ┌ ┐ └ ┘
Lines:       ─ │
T-junctions: ├ ┤ ┬ ┴
Cross:       ┼

Arrows

Simple:      → ← ↓ ↑
Filled:      ▶ ◀ ▼ ▲
Double:      ⇒ ⇐ ⇓ ⇑

Common Patterns

Simple Box

┌───────────────────────────────────────────────────────────────┐
│                           TITLE                               │
├───────────────────────────────────────────────────────────────┤
│                                                               │
│   Content with proper right-padding                           │
│                                                               │
└───────────────────────────────────────────────────────────────┘

Horizontal Flow

┌───────────┐      ┌───────────┐      ┌───────────┐
│  Step 1   │─────▶│  Step 2   │─────▶│  Step 3   │
└───────────┘      └───────────┘      └───────────┘

Vertical Flow

┌─────────────────┐
│     Parent      │
└────────┬────────┘
         │
         ▼
┌─────────────────┐
│     Child       │
└─────────────────┘

Pre-Commit Checklist

  • All lines in each box have IDENTICAL character count
  • Content lines have right-padding before closing │
  • Empty line AFTER every ┌───┐ opening
  • Empty line BEFORE every └───┘ closing
  • Empty lines around every ├───┤ divider
  • Nested boxes have breathing room at ALL levels
  • Flow content is CENTERED within parent box
  • Total width ≤ 70 characters
  • No mixed ASCII/Unicode characters

How to Use

Each rule file in rules/ contains:

  1. Rule explanation with rationale
  2. WRONG example showing the anti-pattern
  3. CORRECT example showing proper implementation
  4. Verification steps

Recommended Tools

Tool URL Platform
ASCIIFlow asciiflow.com Web, free
Monodraw monodraw.helftone.com macOS, paid
Textik textik.com Web, free
Diagon arthursonzogni.com/Diagon Web, free

References

GitHub 仓库 ↗ ← 返回陌讯 Skills 聚合平台
本页面由 陌讯 Skills 聚合平台 收录整理，数据定期更新。