Last updated
Unicode Box Drawing Characters
Unicode includes a dedicated block of box drawing characters (U+2500–U+257F) for creating text-based diagrams, tables, and UI elements in terminals. These characters include horizontal and vertical lines, corners, T-junctions, and cross intersections in both single and double line styles.
Box Drawing Character Reference
| Character | Unicode | Name |
|---|---|---|
| ─ | U+2500 | Horizontal line |
| │ | U+2502 | Vertical line |
| ┌ | U+250C | Top-left corner |
| ┐ | U+2510 | Top-right corner |
| └ | U+2514 | Bottom-left corner |
| ┘ | U+2518 | Bottom-right corner |
| ├ | U+251C | Left T-junction |
| ┤ | U+2524 | Right T-junction |
| ┬ | U+252C | Top T-junction |
| ┴ | U+2534 | Bottom T-junction |
| ┼ | U+253C | Cross |
Drawing a Box in JavaScript
JavaScript
function drawBox(text, padding = 1) {
const lines = text.split('
');
const width = Math.max(...lines.map(l => l.length)) + padding * 2;
const pad = ' '.repeat(padding);
const top = '┌' + '─'.repeat(width) + '┐';
const bottom = '└' + '─'.repeat(width) + '┘';
const body = lines.map(l => '│' + pad + l.padEnd(width - padding) + '│');
return [top, ...body, bottom].join('
');
}
console.log(drawBox('Hello
World'));
// ┌───────┐
// │ Hello │
// │ World │
// └───────┘