99tools

ASCII Art Text Banner

runs in your browser

Turn a word into a big text banner in characters: blocks, a shadow, hashes or the letters themselves, in three sizes, ready to wrap in a code comment.

Letters, digits and the punctuation on a keyboard. Short words read best: a letter is about six pixels wide.

Style
Size

Banner

118 characters wide × 8 lines

Wider than an 80-column terminal; shorter lines of text or single width will narrow it.

about this tool

How it works

Each letter is a small picture: a grid of pixels, seven down and mostly five across for a capital (narrow letters such as I are narrower), from a font drawn for this tool. The letters are set side by side with one blank pixel between them, and each pixel becomes a character. Every line you type becomes a band of the banner, with a blank line between bands, and the empty rows above and below the letters are trimmed, so a word with no tails, such as HELLO, takes seven lines rather than nine.

Styles

  • Block draws each pixel as a full block, █, the boldest look.
  • Shadow adds a light shade, ░, one pixel down and to the right of the letters, for depth.
  • Hash uses #, plain ASCII that pastes anywhere.
  • Letters draws each letter with itself, so the H is made of H's.
  • Custom uses any single character you choose, such as * or @.

Size makes every pixel two or three times as big, both across and down, gaps between lines included. Double width, on by default, draws each pixel two characters wide, because a character is about twice as tall as it is wide; without it the letters come out tall and narrow.

In a source file

A banner at the top of a file or a section is easier to find than a line of text. Choose the comment style for the language and every line is marked: //, #, --, ;, a /* */ block or an HTML <!-- --> comment. An HTML comment cannot contain two hyphens in a row and a block comment ends at a star followed by a slash, so where the art would contain those, the hyphens become ~ and the slash becomes |, with the width unchanged and a note saying so. In a // comment in C or C++, or a # comment in a makefile, a backslash at the end of a line carries the comment on to the next line, which would swallow the first line of code under the banner, so a backslash there becomes | too. Trailing spaces are removed from every line, so a linter has nothing to complain about.

Limits

The font covers the printable ASCII characters. An accented letter is drawn as its plain letter, curly quotes, dashes and the ellipsis as their straight ASCII forms, and full-width letters as ordinary ones. Anything else, such as €, ½ or an emoji, is drawn as a question mark, and so is a struck-through symbol such as ≠, whose plain form would mean the opposite. Both kinds are listed under the banner. A banner takes up to 200 characters on up to 10 lines, though a letter takes about six columns, or twelve at double width, so a long line soon outgrows an 80-column terminal; the tool says when it does. The block and shadow characters need a font that has them to line up when pasted. Nothing is uploaded.

To draw a picture rather than words in characters, use image to ASCII art.

questions

What font are the letters drawn in?
One drawn for this tool: capitals and digits seven pixels tall and mostly five wide, lower case with proper tails on g, j, p, q and y, and all the punctuation on a keyboard. Letters such as i and l are narrower than the rest, so a banner is spaced like type rather than like a grid.
What does double width do?
A character in a monospace font is about twice as tall as it is wide, so a pixel drawn as one character is a tall, thin rectangle and the letters look squeezed. Double width draws each pixel as two characters side by side, which makes it square. Turn it off for a narrower banner that still reads.
Can I put the banner at the top of a source file?
Yes. Choose the comment style for your language and every line is marked, // for C-like languages and Go, # for Python and shell, -- for SQL and Lua, ; for Lisp and INI files, /* */ blocks or HTML comments. In an HTML comment hyphens are drawn as ~, and in a block comment a / after a * as |, because those pairs would end the comment early; in a // or # comment a \ at the end of a line becomes |, as C and make would carry the comment on to the next line. The tool says whenever it has done so.
What happens to letters with accents, or emoji?
An accented letter is drawn as its plain letter, so Café is drawn as Cafe; curly quotes, dashes and the ellipsis become their straight ASCII forms. Characters the font has no shape for, such as € or an emoji, are drawn as a question mark. Either way the tool lists the characters it changed underneath the banner.
Why do the block characters look misaligned when I paste them?
The block and shadow styles use the characters █ and ░. Paste them somewhere with a monospace font that has them, such as a terminal or a code editor, and they line up. In a proportional font, or one without them, the columns drift; the hash and letters styles use plain ASCII and survive almost anywhere.