╔═══════════════════════════════════════════════════════╗ ║ ║ ║ _ ____ ____ ___ ___ _ ____ _____ ║ ║ / \ / ___| / ___|_ _|_ _| / \ | _ \_ _| ║ ║ / _ \ \___ \| | | | | | / _ \ | |_) || | ║ ║ / ___ \ ___) | |___ | | | | / ___ \| _ < | | ║ ║ /_/ \_\____/ \____|___|___| /_/ \_\_| \_\|_| ║ ║ ║ ║ TEXT-MODE DESIGN SYSTEM v1.0 ║ ╚═══════════════════════════════════════════════════════╝

Box-Drawing / ANSI Color / BBS Nostalgia / Demoscene

────────────────────────────────────────────────────────────
01 Color Palette
╔══════════════════════════════════════════════════╗ ║ The standard ANSI 16-color palette: 8 normal ║ ║ colors + 8 bright/high-intensity variants. ║ ║ The foundation of BBS art and text-mode UI. ║ ╚══════════════════════════════════════════════════╝

Normal Colors (0-7)

Black#0C0C0C
Red#C50F1F
Green#13A10E
Yellow#C19C00
Blue#0037DA
Magenta#881798
Cyan#3A96DD
White#CCCCCC

Bright / High-Intensity Colors (8-15)

Bright Blk#767676
Bright Red#E74856
Bright Grn#16C60C
Bright Yel#F9F1A5
Bright Blu#3B78FF
Bright Mag#B4009E
Bright Cyn#61D6D6
Bright Wht#F2F2F2

ANSI Escape Sequence Preview

user@bbs:~/art$ ls -la drwxr-xr-x 3 user group 4096 Jan 15 . drwxr-xr-x 8 user group 4096 Jan 14 .. -rw-r--r-- 1 user group 847 Jan 15 dragon.ans -rw-r--r-- 1 user group 2304 Jan 15 welcome.asc -rwxr-xr-x 1 user group 1024 Jan 14 render.sh user@bbs:~/art$ _
02 Typography
┌──────────────────────────────────────────────────┐ │ Three monospace faces. Everything is monospace. │ │ Characters align to a grid. Always. │ └──────────────────────────────────────────────────┘
Display / JetBrains Mono 800
TEXT MODE
48px / 800 weight / line-height 1.1
Heading 1 / JetBrains Mono 700
System Online
32px / 700 weight / line-height 1.2
Heading 2 / JetBrains Mono 600
Connection Established
24px / 600 weight / line-height 1.3
Heading 3 / JetBrains Mono 600
Downloading message base...
18px / 600 weight / line-height 1.4
Body / Fira Code 400
The BBS (Bulletin Board System) was the internet before the internet. Sysops ran boards from their basements, users dialed in one at a time, and ANSI art turned 80-column text into vivid scenes of dragons, logos, and neon cityscapes.
15px / 400 weight / line-height 1.7
Small / IBM Plex Mono 400
STATUS: Connected at 14400 baud | Node 2 of 4 | Time left: 45 min
13px / 400 weight / line-height 1.5
Caption / IBM Plex Mono Uppercase
Last caller: The Mentor | Sysop: Phreak Nasty | EST. 1993
11px / 400 weight / uppercase / letter-spacing 0.1em

FIGlet / Figlet Banner Samples

____ ____ ____ | __ )| __ )/ ___| | _ \| _ \\___ \ | |_) | |_) |___) | |____/|____/|____/
___ ___ _ __ ___ ___ ___ ___ ___ _ __ ___ / _ \/ _ \ '_ ` _ \ / _ \/ __|/ __/ _ \ '_ \ / _ \ | (_) \__/ | | | | | | (_) \__ \ (_| __/ | | | __/ \___/\___/|_| |_| |_|\___/|___/\___\___|_| |_|\___|
03 Spacing Scale

Grid-aligned spacing based on a 4px base unit. In text mode, everything snaps to character boundaries.

--space-xs 4px
--space-sm 8px
--space-md 16px
--space-lg 24px
--space-xl 32px
--space-2xl 48px
--space-3xl 64px
04 Buttons
├──────────────────────────────────────────────────┤ │ Two styles: bordered buttons and ASCII bracket │ │ buttons [ like this ]. Keyboard-first design. │ ├──────────────────────────────────────────────────┤

Standard Buttons

ASCII Bracket Buttons

Button Sizes

05 Forms

Text-mode form controls. Checkboxes render as [X], radio buttons as (*). Everything stays in the character grid.

Your BBS username (max 24 chars)
06 Cards & Panels

Content containers in three styles: bordered cards, ANSI color-accent cards, and pure ASCII box-drawing cards.

Standard Cards

Message Boards
FidoNet echomail conferences, local message areas, and netmail. The original social network, one packet at a time.
Area: GENERAL | Posts: 2,847 | Last: 01/15/94
File Libraries
Shareware, freeware, ANSI art packs, and demoscene productions. Download via ZMODEM at 14.4 kbps if you are lucky.
Files: 12,304 | Size: 1.2 GB | Protocol: ZMODEM

ANSI Color-Accent Cards

System Status
All nodes operational. Modem pool at 75% capacity. Nightly FidoNet poll scheduled for 02:00.
New Uploads
3 new files awaiting sysop approval. ACiD art pack #42 and two door game updates.
Maintenance
Scheduled downtime Saturday 03:00-05:00 for disk defragmentation and backup.
Security Alert
Failed login attempts from unknown caller ID. Password policy updated. Change yours today.

Box-Drawing ASCII Cards

┌─────────────────────────────────────────────────────┐ │ TODAY'S CALLERS │ ├─────────────────────────────────────────────────────┤ │ #1 The Mentor 14:23 Node 1 28.8k │ │ #2 Phiber Optik 15:01 Node 2 14.4k │ │ #3 Erik Bloodaxe 16:44 Node 1 33.6k │ │ #4 Knight Lightning 18:12 Node 3 28.8k │ │ #5 Acid Phreak 19:30 Node 2 56k │ ├─────────────────────────────────────────────────────┤ │ Total calls today: 5 Time online: 3h 22m │ └─────────────────────────────────────────────────────┘
07 Alerts & Notices

System messages in both styled and pure-ASCII formats.

[INFO] You have 3 new messages in your mailbox. Type R to read.
[OK] File transfer complete. dragon.ans (847 bytes) saved to download directory.
[WARN] You have 12 minutes remaining on this session. Save your work.
[ERROR] Carrier lost. Connection terminated. Please redial.

ASCII-Framed Alerts

╔══════════════════════════════════════════╗ ║ WELCOME TO SHADOW REALM BBS! ║ ║ ║ ║ SysOp: Dark Angel ║ ║ Nodes: 4 (USR Sportster 56k) ║ ║ Software: RemoteAccess 2.62 ║ ║ Online since: March 1993 ║ ║ ║ ║ "Where the bits flow freely" ║ ╚══════════════════════════════════════════╝
┌──── WARNING ────────────────────────────┐ │ │ │ UNAUTHORIZED ACCESS DETECTED │ │ Your IP has been logged. │ │ Authorities have been notified. │ │ │ │ (Just kidding. But seriously, │ │ don't try anything funny.) │ │ │ └──────────────────────────────────────────┘
08 Navigation

Tab Bar Navigation

Main Messages Files Doors Users Sysop

Breadcrumb Trail

Home > Files > ANSI Art > ACiD Pack #42

BBS-Style Menu

╔═══════════════════════════╗ ║ MAIN MENU ║ ╠═══════════════════════════╣ ║ ║ ║ [M] Message Areas ║ ║ [F] File Libraries ║ ║ [D] Door Games ║ ║ [U] User List ║ ║ [C] Chat with SysOp ║ ║ [S] System Stats ║ ║ [G] Goodbye (Logoff) ║ ║ ║ ╚═══════════════════════════╝ Select: _
09 Tables

HTML Table

Handle Calls Posts UL/DL Ratio Last On
The Mentor 342 1,205 3.2:1 01/15/94
Phiber Optik 287 894 2.8:1 01/14/94
Dark Angel 512 2,341 5.1:1 01/15/94
Acid Phreak 198 456 1.5:1 01/13/94

Pure ASCII Table

+------------------+-------+--------+-----------+----------+ | BBS Software | Year | Nodes | Protocol | Platform | +------------------+-------+--------+-----------+----------+ | RemoteAccess | 1989 | 250 | FidoNet | DOS | | Telegard | 1988 | 32 | FidoNet | DOS | | Wildcat! | 1986 | 250 | QWK | DOS/Win | | Synchronet | 1992 | Unl | FidoNet | Multi | | Renegade | 1992 | 10 | FidoNet | DOS | +------------------+-------+--------+-----------+----------+
10 Code Blocks
#!/bin/bash # Convert ANSI art to HTML for file in *.ans; do echo "Converting: $file" ansilove "-i" "$file" "-o" "${file%.ans}.png" echo " Output: ${file%.ans}.png" done echo "Done. Converted $(ls *.png | wc -l) files."
C:\BBS> type WELCOME.ANS _____ _ _ / ____| | | | | (___ | |__ __ _ __| | _____ __ \___ \| '_ \ / _` |/ _` |/ _ \ \ /\ / / ____) | | | | (_| | (_| | (_) \ V V / |_____/|_| |_|\__,_|\__,_|\___/ \_/\_/ R E A L M B B S C:\BBS> _
11 Progress & Loading

ASCII progress bars built from block characters and standard text glyphs.

FILE TRANSFER: dragon.ans (847 bytes)
Download: [####################..........] 67% 14.4 kbps
SYSTEM LOAD
CPU: [|||||||||||||||| ] 80%
Memory: [|||||||||| ] 50%
Disk: [|||||||||||||||||| ] 90%
Network:[||| ] 15%
UPLOAD PROGRESS
Sending: [=========> ] 45% ETA: 2m 13s
ZMODEM TRANSFER
Block 142 of 312 ███████████████░░░░░░░░░░░░░░░░░░░ 45%
12 ASCII Art Showcase

Sample artwork demonstrating the aesthetic range of character-based art, from simple line art to ANSI-colored compositions.

Box-Drawing Character Set

Single-line: ┌─┬─┐ Double-line: ╔═╦═╗ Mixed: ╒═╤═╕ │ │ │ ║ ║ ║ │ │ │ ├─┼─┤ ╠═╬═╣ ╞═╪═╡ │ │ │ ║ ║ ║ │ │ │ └─┴─┘ ╚═╩═╝ ╘═╧═╛ Rounded: ╭───╮ Dashed: ┌╌╌╌┐ Heavy: ┏━┳━┓ │ │ ╎ ╎ ┃ ┃ ┃ ╰───╯ └╌╌╌┘ ┗━┻━┛

Block Elements

Full: ████ Dark: ▓▓▓▓ Medium: ▒▒▒▒ Light: ░░░░ ██▓▓▒▒░░ ██▓▓▒▒░░ ██▓▓▒▒░░ ██▓▓▒▒░░ ██▓▓▒▒░░

ANSI Art Scene

. * . . * . . * * . ___|___ . * . . . .' | '. . * * . / | \ . . . . | ----+---- | * . * | / \ | . * | / \ | . | / \ | . . * __|_/ \_|__ * ___________/ \___________ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Lighthouse at Midnight
13 Design Principles
═══════════════════════════════════════════════════════
01
Monospace Everything
Every character occupies the same width. Art, text, and UI all share the same grid. This is the fundamental constraint that defines ASCII art -- and its greatest creative strength.
02
16 Colors, No More
The ANSI palette is 8 colors plus 8 bright variants. No gradients, no alpha, no RGB. Constraint breeds creativity: every color choice is deliberate and visible.
03
Borders Are Structure
Box-drawing characters (single, double, heavy, rounded) replace CSS borders. They are part of the content, not decoration. The border IS the layout.
04
Black Canvas
The background is always black or near-black. Like a terminal, the screen is dark by default. Color is applied to characters, not backgrounds. Light on dark, always.
05
80 Columns Wide
The classic terminal width. ASCII art was composed for 80x25 character screens. Respecting this constraint keeps art readable and preserves the authentic proportions of the era.
06
Text IS the Interface
Brackets for buttons [OK], parentheses for radio (*), hashes for progress bars ####. Every UI element is built from typed characters. The keyboard is the only input device.
14 BBS Login Demo
╔═══════════════════════════════════════════════════════╗ ║ _____ _ _ ║ ║ / ____| | | | ║ ║ | (___ | |__ __ _ __| | _____ __ ║ ║ \___ \| '_ \ / _` |/ _` |/ _ \ \ /\ / / ║ ║ ____) | | | | (_| | (_| | (_) \ V V / ║ ║ |_____/|_| |_|\__,_|\__,_|\___/ \_/\_/ ║ ║ ║ ║ R E A L M B B S - Est. 1993 - ║ ║ Running RemoteAccess 2.62 on 4 nodes ║ ║ FidoNet 1:234/567 | 56k USR Sportster ║ ╠═══════════════════════════════════════════════════════╣ ║ ║ ║ Handle: The_Mentor ║ ║ Password: ********** ║ ║ ║ ║ ACCESS GRANTED - Security Level: 100 ║ ║ Last login: 01/14/94 at 22:17 ║ ║ You have 3 new messages. ║ ║ ║ ╚═══════════════════════════════════════════════════════╝