Image to ASCII art
Choose a picture and see it as text. Set how many characters wide the result should be, pick a character set from a simple ramp to a detailed one or block characters, and copy the text. A coloured HTML version is available too. Nothing is uploaded.
Runs in your browser: nothing you enter is sent anywhere.
How to use it
- Choose a picture.
- Set the width in characters. 80 is good for a terminal, 150 or more shows more detail.
- Pick a character set and turn Invert on if the text will be light on dark.
- Press Copy text, Copy HTML (when Coloured is on) or Download .txt.
How it works
The picture is divided into a grid of columns and rows, and each cell takes the average colour of its pixels. The number of rows is columns × height × 0.5 / width, rounded, because a character cell is about twice as tall as wide. The brightness of each cell then picks a character from the set. With the standard ramp of 10 characters, brightness 128 gives round(128 / 255 × 9) = 5, the sixth character, =.
Character sets run from dense to empty: standard (@%#*+=-:. ), detailed with 70 characters, blocks (█▓▒░) and binary (10). Width is limited to 10–300 characters.
Tips
- Use a monospace font when you paste the text; in a proportional font the picture falls apart.
- Pictures with a clear subject and good contrast work best. Raise the contrast first if the result looks flat.
- The block set is narrow and bold, so it gives a clean look even at small widths.
Frequently asked questions
Why does the picture look squashed or stretched?
Text cells are taller than they are wide, roughly 2 to 1. The tool therefore uses half as many rows as columns for a square picture: 80 characters wide and 80 pixels wide gives 40 rows. A different font can still change the shape a little.
When should I use Invert?
Normal mode maps bright areas to blank space and dark areas to dense characters, which matches dark text on white paper or a light web page. Invert does the opposite for light text on a dark background, such as a terminal.
How are brightness and characters matched?
Brightness is 0.2126 R + 0.7152 G + 0.0722 B on the 0 to 255 values. The result is placed on the character ramp, from the densest character to a space. With the standard ramp @%#*+=-:. a mid-grey of 128 becomes the = sign.
What is the coloured version?
Each character gets the colour of its part of the picture. The colours are rounded to 16 levels per channel so that neighbouring characters can share one span and the HTML stays smaller. Copy HTML gives a pre element with inline styles that you can paste into a web page.
Is the picture uploaded?
No. It is decoded and averaged in your browser. Transparent areas are treated as white.