Overview
Introduction
Framing a block of text with a clean ASCII or Unicode border by hand means carefully counting characters to keep every side straight, which quickly becomes error-prone.
It runs entirely client-side, so nothing you paste is ever uploaded to a server.
What Is Text Box Drawer?
A text box drawer that wraps the input in a Unicode box-drawing-character border, automatically sized to fit the longest line with 1-space padding inside.
It runs entirely client-side as part of this site's String Tools collection, so nothing you paste is ever uploaded to a server.
How Text Box Drawer Works
The tool finds the length of the longest line in the input, builds top and bottom border rows sized to that width plus padding, and wraps each line of text between vertical bar characters with 1 space of padding on each side.
The transformation happens synchronously in JavaScript the moment you type, with no network round trip involved.
When To Use Text Box Drawer
Use it to frame a message for a terminal banner, a README file, a code comment, or any plain-text context that supports Unicode.
It's a fast way to get the answer without opening a code editor, a REPL, or writing a one-off script just to check.
Often used alongside Text Columnizer and String Repeater.
Features
Advantages
- Automatically sizes the box to fit the longest line, no manual measuring needed.
- Keeps every line's box edges perfectly aligned via consistent padding.
Limitations
- Requires a monospace font to display correctly; the box will look misaligned in a proportional font.
Examples
Best Practices & Notes
Best Practices
- View or paste the output into a monospace context, like a terminal or code block, so the border stays aligned.
Developer Notes
The border width is `Math.max(...lines.map((line) => line.length)) + 2` to account for the 1-space padding on each side, and every line is padded with `line.padEnd(width, " ")` before being wrapped in `│ ` and ` │`, keeping the right edge straight even when line lengths vary.
Text Box Drawer Use Cases
- Framing a terminal banner or startup message
- Highlighting a note or warning in a README or plain-text file
- Adding a decorative border to a short piece of ASCII art
Common Mistakes
- Viewing the output in a proportional font, where the border won't align correctly.
- Expecting the box to auto-wrap long lines; it only pads to the longest existing line.
Tips
- Keep each input line reasonably short so the resulting box stays a manageable width.