Last updated
What Is Unicode Art?
Unicode art uses the full range of Unicode characters — box-drawing symbols, block elements, braille patterns, geometric shapes, and more — to create visual compositions in plain text. It goes far beyond ASCII art by leveraging over 140,000 Unicode characters with visual properties.
Box-Drawing Characters
Create clean table borders and diagrams using Unicode box-drawing characters (U+2500–U+257F):
┌─────────────────────────────┐
│ Unicode Box Drawing Table │
├──────────────┬──────────────┤
│ Single Line │ Double Line │
├──────────────┼──────────────┤
│ ─ │ ┤ ├ ┼ │ ═ ║ ╔ ╗ ╚ │
│ ┌ ┐ └ ┘ ┬ │ ╝ ╠ ╣ ╦ ╩ │
└──────────────┴──────────────┘
Block Element Art
Block elements (U+2580–U+259F) allow pixel-art style images with sub-character resolution:
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
█ ▄▄▄▄▄▄▄▄ █
█ █ █ █
█ █ ██ █ █
█ █ █ █
█ ▀▀▀▀▀▀▀▀ █
▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄
Characters used:
▀ Upper half block U+2580
▄ Lower half block U+2584
█ Full block U+2588
▌ Left half block U+258C
▐ Right half block U+2590
Braille Pattern Art
Braille characters (U+2800–U+28FF) provide high-resolution dot-matrix images. Each character is a 2×4 grid of dots:
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
Each braille character = 2×4 pixel grid
256 possible dot combinations
Used by terminal image viewers for high-res text images
Geometric Shape Art
Unicode geometric shapes create icons and decorative patterns:
Shapes available:
▲ △ ▴ ▵ Triangles (filled and outline)
● ○ ◉ ◎ Circles
■ □ ▪ ▫ Squares
◆ ◇ ◈ Diamonds
★ ☆ ✦ ✧ Stars
→ ← ↑ ↓ Arrows
♠ ♥ ♦ ♣ Card suits
Example composition:
★ ★ ★ ★ ★
◆ ◆
◆ ● ● ◆
◆ ◆
◆ ▲▲▲ ◆
◆ ◆
◆ ◆
◆
Fullwidth and Mathematical Text Styles
Unicode provides styled text variants without HTML formatting:
Normal: Hello World
Fullwidth: Hello World
Bold: 𝐇𝐞𝐥𝐥𝐨 𝐖𝐨𝐫𝐥𝐝
Italic: 𝐻𝑒𝑙𝑙𝑜 𝑊𝑜𝑟𝑙𝑑
Bold Italic: 𝑯𝒆𝒍𝒍𝒐 𝑾𝒐𝒓𝒍𝒅
Script: ℋ𝑒𝓁𝓁𝑜 𝒲𝑜𝓇𝓁𝒹
Fraktur: ℌ𝔢𝔩𝔩𝔬 𝔚𝔬𝔯𝔩𝔡
Double-struck: ℍ𝕖𝕝𝕝𝕠 𝕎𝕠𝕣𝕝𝕕
README and Terminal Decoration
Use box-drawing characters to create professional-looking README headers:
╔══════════════════════════════════════╗
║ MyProject v2.0.0 ║
║ Fast · Reliable · Open Source ║
╚══════════════════════════════════════╝
┌─ Installation ──────────────────────┐
│ npm install myproject │
└─────────────────────────────────────┘
┌─ Features ──────────────────────────┐
│ ✓ Zero dependencies │
│ ✓ TypeScript support │
│ ✓ 100% test coverage │
└─────────────────────────────────────┘
Tree Diagram with Box Characters
Represent directory structures or hierarchies:
project/
├── src/
│ ├── components/
│ │ ├── Button.tsx
│ │ └── Input.tsx
│ ├── utils/
│ │ └── helpers.ts
│ └── index.ts
├── tests/
│ └── unit/
│ └── helpers.test.ts
└── package.json
Emoji Art Composition
Combine emoji to create visual scenes:
🌅 Morning Scene:
☀️🌤️🌤️🌤️🌤️🌤️
🌲🏠🌲🌲🏠🌲
🌿🌿🌿🌿🌿🌿
🛤️🛤️🛤️🛤️🛤️🛤️
🌌 Night Scene:
🌙⭐✨⭐✨⭐🌙
🌲🏠🌲🌲🏠🌲
🌑🌑🌑🌑🌑🌑
Code Comment Headers
Use Unicode art to create distinctive section headers in code:
/*
* ╔═══════════════════════════════╗
* ║ Authentication Module ║
* ║ Author: [name] ║
* ║ Version: 1.0.0 ║
* ╚═══════════════════════════════╝
*/
// ─────────────────────────────────────
// SECTION: Database Utilities
// ─────────────────────────────────────
// ▶ Helper Functions ◀
function parseUser() { ... }
Common Unicode Art Character Reference
- Box drawing: U+2500–U+257F (lines, corners, junctions)
- Block elements: U+2580–U+259F (filled rectangles)
- Braille patterns: U+2800–U+28FF (dot matrices)
- Geometric shapes: U+25A0–U+25FF (squares, circles, triangles)
- Miscellaneous symbols: U+2600–U+26FF (weather, chess, etc.)
- Dingbats: U+2700–U+27BF (arrows, checkmarks, stars)